我想獲取我的產(chǎn)品并使用滑塊循環(huán)所有產(chǎn)品。我正在嘗試使用 @foreach 函數(shù)獲取所有產(chǎn)品，但我沒有獲得原始滑塊的確切視圖。請(qǐng)幫助我如何執(zhí)行此滑塊循環(huán)。我附上了原來的用戶界面并嘗試了代碼。原始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 個(gè)產(chǎn)品。第一個(gè)活動(dòng)行有 3 個(gè)圖像，其他行各有 3 個(gè)產(chǎn)品詳細(xì)信息。
1 回答
慕碼人8056858
TA貢獻(xiàn)1803條經(jīng)驗(yàn) 獲得超6個(gè)贊
好吧，問題是您仍在循環(huán)單個(gè)product.product::where('prod_flag','1')->get();返回集合，并且正在循環(huán)該集合。因此，您一直循環(huán)一行意味著一行中只有一個(gè)圖像，并且該行包含一個(gè)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);
這會(huì)輸出如下所示的內(nèi)容
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 [?]
正如您現(xiàn)在所看到的，一個(gè)系列中有 3 種產(chǎn)品。所以現(xiàn)在你所要做的就是循環(huán)集合，然后在該循環(huán)中循環(huán)數(shù)組。像下面這樣的東西
@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
- 1 回答
- 0 關(guān)注
- 127 瀏覽
添加回答
舉報(bào)
0/150
提交
取消