如何根据数据库中的项目数设置网格中的列长度？答案

【问题标题】：How can i set column length in grid according to number of items in my database?如何根据数据库中的项目数设置网格中的列长度？
【发布时间】：2019-05-22 09:31:40
【问题描述】：

我正在尝试在网格中的数据库中显示我的 laravel 项目的横幅。但问题是，如果我的数据库中有 1 个项目，我希望我的网格类是 col-12，如果我的数据库中有超过 1 个项目，我希望类是 col-6。

@if($status == 1)
<div style="background: {{$color}};">
    <div class="container">
        <div class="row">
        @foreach($data['banners'] as $banner )
        @if($banner->status==1)
        <div class="col-6 p-1">
                <div style="background-image:url(assets/images/{{$banner->bannerImage}});background-size: cover;height:55vh" class="jumbotron jumbotron-fluid">
                        <div class="container bannertext text-wrap">
                            <h1 class="">{{$banner->heading}}</h1>
                            <h3 class="">{{$banner->subHeading}}</h3>
                            <p class="lead">{{$banner->description}}</p>
                        </div>
                </div>
        </div>
        @endif
        @endforeach
        </div>
    </div>
</div>
@endif

【问题讨论】：

标签： html laravel grid

【解决方案1】：

我找到了解决方案。检查数据库中的计数是否大于 1，然后使用 col-6 sn-p 否则使用 col-12 sn-p。

@if(count($data['bannercount'])>1)

<div class="container">
    <div class="row">
        @foreach($data['banners'] as $banner )
        <div class="col-6">
            <div style="background-image:url(assets/images/{{$banner->bannerImage}});"
                class="jumbotron jumbotron-fluid">
                    <div class="container bannertext text-wrap">
                        <h1 class="">{{$banner->heading}}</h1>
                        <h3 class="">{{$banner->subHeading}}</h3>
                    <p class="lead">{{$banner->description}}</p>
                </div>
            </div>
        </div>
        @endforeach
    </div>
</div>
@else 
<div class="row">
    @foreach($data['banners'] as $banner )
    <div class="col-12">
        <div style="background-image:url(assets/images/{{$banner->bannerImage}});"
             class="jumbotron jumbotron-fluid">
            <div class="container bannertext text-wrap">
                <h1 class="">{{$banner->heading}}</h1>
                <h3 class="">{{$banner->subHeading}}</h3>
                <p class="lead">{{$banner->description}}</p>
            </div>
        </div>
    </div>
    @endforeach
</div>
@endif

【讨论】：