使用 Laravel 5.6 循环产品滑块

Question

我想获取我的产品并使用滑块循环所有产品。我正在尝试使用 @foreach 函数获取所有产品，但我没有获得原始滑块的确切视图。请帮助我如何执行此滑块循环。我附上了原来的用户界面并尝试了代码。原始HTML代码<div class="carousel slide media-carousel" id="media">        <div class="carousel-inner">          <div class="item  active">            <div class="row">              <div class="col-md-4">                <h4 style=" text-align: center; font-weight: 600 !important;">Product Name</h4>                <a class="thumbnail" href="#"><img alt="" src="./images/cap.jpg"></a>                <p style=" text-align: center; font-size: 15px;">Product Description</p>                <a href="#" class="btn-1">Enquiry Basket</a>              </div>                        <div class="col-md-4">                <h4 style=" text-align: center; font-weight: 600 !important;">Product Name</h4>                <a class="thumbnail" href="#"><img alt="" src="./images/cap.jpg"></a>                <p style=" text-align: center; font-size: 15px;">Product Description</p>                <a href="#" class="btn-1">Enquiry Basket</a>              </div>              <div class="col-md-4">                <h4 style=" text-align: center; font-weight: 600 !important;">Product Name</h4>                <a class="thumbnail" href="#"><img alt="" src="./images/cap.jpg"></a>                <p style=" text-align: center; font-size: 15px;">Product Description</p>                <a href="#" class="btn-1">Enquiry Basket</a>              </div>                    </div>          </div>我的问题每行只能显示 3 个产品。第一个活动行有 3 个图像，其他行各有 3 个产品详细信息。

Answer 1

好吧，问题是您仍在循环单个product.product::where('prod_flag','1')->get();返回集合，并且正在循环该集合。因此，您一直循环一行意味着一行中只有一个图像，并且该行包含一个col-md-4.

 <div class="row">

                      <div class="col-md-4">

                        <h4 style=" text-align: center; font-weight: 600 !important;">{{$Pro->product_name}}</h4>

                        <a class="thumbnail" href="#"><img alt="{{$Pro->product_name}}" src="{{asset($Pro->prod_image1)}}"></a>

                        <p style=" text-align: center; font-size: 15px;">{{$Pro->prod_short_description}}</p>

                        <a href="#" class="btn-1">Enquiry Basket</a>

                      </div>

            </div>

所以你要做的就是通过下面的 collection chunk() 方法将集合分块到子集合中。

$products = product::where('prod_flag','1')->get()->chunk(3);

这会输出如下所示的内容

0 => Illuminate\Database\Eloquent\Collection {#1792 ▼

  #items: array:3 [▶]

}

1 => Illuminate\Database\Eloquent\Collection {#1795 ▼

  #items: array:3 [▶]

}

2 => Illuminate\Database\Eloquent\Collection {#1794 ▶}

3 => Illuminate\Database\Eloquent\Collection {#1793 ▼

  #items: array:3 [▶]

正如您现在所看到的，一个系列中有 3 种产品。所以现在你所要做的就是循环集合，然后在该循环中循环数组。像下面这样的东西

     @foreach($Product as $Pro)

        @if($loop->first)

          <div class="item active">

        @else

          <div class="item">

        @endif

            <div class="row">

@foreach($Pro as $singlePro)

                      <div class="col-md-4">

                        <h4 style=" text-align: center; font-weight: 600 !important;">{{$singlePro->product_name}}</h4>

                        <a class="thumbnail" href="#"><img alt="{{$singlePro->product_name}}" src="{{asset($singlePro->prod_image1)}}"></a>

                        <p style=" text-align: center; font-size: 15px;">{{$Pro->prod_short_description}}</p>

                        <a href="#" class="btn-1">Enquiry Basket</a>

                      </div>

@endforeach

            </div>

          </div>

        @endforeach