Jquery 在Laravel数据表中显示多个图像

我多次尝试在数据表中显示多个图像，但总是失败。它只显示单个图像

数据库中的图像

[{"name":"_MG_2288 (1).jpg","path":"public\/product_images\/\/mKBWAFw7ZYgVqvz1lrxrEA5PYbal1EqqKm9jEx0F.jpg"},{"name":"555dca050423bda8418b4567.jpeg","path":"public\/product_images\/\/QnYnO9SfA9JJIu7wm0rxJOIJog6txmED8pdiZ4nM.jpg"}]

控制器

$data = \App\Product::latest()->get();

        return Datatables::of($data)
            ->addIndexColumn()
            ->addColumn('photo', function ($product) {
                foreach (json_decode($product->product_photo) as $picture) {
                    $pict = '<img src="/reference/eureka/storage/app/' . $picture->path . '" style="height:120px; width:200px"/>';
                    return $pict;
                }
            })
            ->rawColumns(['photo'])
            ->make(true);

---

return

inside

foreach

将停止循环。您应该使用

return

外部

foreach

。此外，还可以使用

内爆（）

从数组元素返回字符串。因此，所有图像都可以显示

$pict = [];
                foreach (json_decode($product->product_photo) as $picture) {
                    $pict[] = '<img src="/reference/eureka/storage/app/' . $picture->path . '" style="height:120px; width:105px; margin-bottom:10px;"/>';
                }
                $pict = implode(', ', $pict);
                return $pict;

$pict=[]；
foreach（json_解码（$product->product_photo）为$picture）{
$pict[]=“路径”。“style=”高度：120px；宽度：105px；边距底部：10px；“/>”；
}
$pict=内爆（'，'，$pict）；
返回$pict；

在控制器中按如下方式保存

        if($request->hasfile('product_image'))
        {

            foreach($request->file('product_image') as $product_image)
            {
                $name=$product_image->getClientOriginalName();
                $destinationPath = public_path('/uploads/products/');
                $product_image->move($destinationPath, $name);

                $product_images[] = $name;
            }

            $post->product_image = $product_images;

        }

在视图中，如果在旋转木马上返回，请使用滑块并获取带有索引的图像

            <div class="w3-white w3-text-grey w3-card-4" >

                <div id="carouselExampleFade" class="carousel slide carousel-fade" data-ride="carousel">
                    <div class="carousel-inner">


                        @foreach($data->product_image as $slider)

                            <div class="carousel-item {{ $loop->first ? 'active' : '' }}" width="250" height="300">

                                <img class="d-block w-100" src="{{asset('uploads/products/' . $slider)}}" width="250" height="300" alt="{{$data->product_name}}">

                            </div>

                        @endforeach


                    </div>
                    <a class="carousel-control-prev" href="#carouselExampleFade" role="button" data-slide="prev">
                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="carousel-control-next" href="#carouselExampleFade" role="button" data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>

                <div class="w3-container" style="text-align: center">
                </div>
            </div><br>

@foreach（$data->product\u图像作为$slider）
产品名称}}“>
@endforeach

这是我将所有图像显示到一个视图中的方法，但每次只显示一个图像。。。我不知道你是否想像画廊一样展示它们，但对于一次一个来说，效果很好。

            <div class="w3-white w3-text-grey w3-card-4" >

                <div id="carouselExampleFade" class="carousel slide carousel-fade" data-ride="carousel">
                    <div class="carousel-inner">


                        @foreach($data->product_image as $slider)

                            <div class="carousel-item {{ $loop->first ? 'active' : '' }}" width="250" height="300">

                                <img class="d-block w-100" src="{{asset('uploads/products/' . $slider)}}" width="250" height="300" alt="{{$data->product_name}}">

                            </div>

                        @endforeach


                    </div>
                    <a class="carousel-control-prev" href="#carouselExampleFade" role="button" data-slide="prev">
                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="carousel-control-next" href="#carouselExampleFade" role="button" data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>

                <div class="w3-container" style="text-align: center">
                </div>
            </div><br>