【问题标题】:laravel photos not showing properlylaravel 照片没有正确显示
【发布时间】:2020-03-31 01:19:27
【问题描述】:

我正在制作一个显示照片的 laravel 程序,假设将它们全部显示在一个网格中,但事实并非如此,它们到处都是显示图像的代码

@extends('layouts.app')

@section('content')

  @if(count($albums)>0)
    <?php
    $colcount = count($albums);
    $i = 1;
    ?>
  <div id='albums'>
    <div class="row text-center">
      @foreach($albums as $album)
        @if($i == $colcount)
          <div class="medium-8 colums end">
            <a href="../public/albums/{{$album->id}}">
              <img class="thumbnail" src="storage/album_covers/{{$album->cover_image}}"alt={{$album->name}}">
              <br>
              <h6>{{$album->name}}</h6>
         @else
           <div class="medium-8 colums">
            <a href="../public/albums/{{$album->id}}">
              <img class="thumbnail" src="storage/album_covers/{{$album->cover_image}}"alt={{$album->name}}">
              <br>
              <h6>{{$album->name}}</h6>
          @endif
         @if($i % 4 == 0)
         </div</div><div class="row text-center">
         @else
           </div>
         @endif
          @endif
       <?php $i ++ ?>
   @endforeach
   </div>
   </div>
 @else
  <p>No Albums to Display</p>
@endif

@endsection

我对这段代码的理解是,它应该显示 4 行,每行 8 张图像。我已经检查了很多次这段代码,但我找不到问题所在。 任何帮助表示赞赏 谢谢

【问题讨论】:

  • 尝试从 bootstrap 添加到名为 img-fluidimg 标签类

标签: php laravel twitter-bootstrap


【解决方案1】:

storage/app/public 目录可用于存储用户生成的文件,例如个人资料头像,这些文件应该可以公开访问。您应该在public/storage 创建一个指向该目录的符号链接。您可以使用php artisan storage:link 命令创建链接。

https://laravel.com/docs/7.x/structure#the-storage-directory

完成后,并确保文件存在于存储目录中,您可以使用asset 函数链接到该文件。

<img class="img-thumbnail" 
    src="{{ asset('storage/album_covers/' . $album->cover_image) }}"
    alt="{{ $album->name }}">

【讨论】:

  • 感谢linktoahref
  • 我已经制作了工匠 stroage:link 工作正常,图像是缩略图形式,只是使用上述代码无法正确显示
  • 您可能需要检查您的 html 结构,因为它似乎有不完整的 div 标签,而且似乎还有一个额外的@endif。还将thumbnail 类替换为img-thumbnail
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-12-09
  • 2017-12-10
  • 1970-01-01
  • 1970-01-01
  • 2015-07-05
相关资源
最近更新 更多