如何用foreach做几行?

时间:2019-08-24 07:00:30

标签: php html laravel bootstrap-4

我正在使用Laravel 5.8,并且在我的控制器中,我使用paginate()显示4个元素:

public function index()
{
    $proyects = Proyect::latest()->paginate(4);
    return view('proyect.index', compact('proyects'));
}

该视图中的4个元素位于一行中,但我想为每行显示2个元素。

<div class="row">

<div class="col-10 col-lg-12 col-md-6">
    <div class="card-deck">
        @forelse($proyects as $proyect)

        <div class="card">
            <div class="card-body">
                <h5 class="card-title">{{ $proyect->title }}</h5>
                <h6 class="card-subtitle mb-2 text-muted">
                 {{ $proyect->descripcion }}</h6>
                <p class="card-text">You can use the cap image as an 
                    overlay for the body</p>
                <a href="{{ route('proyect.show', $proyect) }}" 
                    class="card-link">Ver mas</a>
            </div>
            <div class="card-footer">
                <small class="text-muted">
                 {{ $proyect->created_at->diffForHumans() }}</small>
            </div>
        </div>

        @empty

        <li> Empty </li>

        @endforelse
    </div>
</div>

如何显示每行2个项目而不是一行中的所有项目?

2 个答案:

答案 0 :(得分:0)

这可能是您的解决方案:


<div class="row">
@forelse($proyects as $proyect)
<div class="col-6 col-lg-6 col-md-6">
    <div class="card-deck">


        <div class="card">
            <div class="card-body">
                <h5 class="card-title">{{ $proyect->title }}</h5>
                <h6 class="card-subtitle mb-2 text-muted">
                 {{ $proyect->descripcion }}</h6>
                <p class="card-text">You can use the cap image as an 
                    overlay for the body</p>
                <a href="{{ route('proyect.show', $proyect) }}" 
                    class="card-link">Ver mas</a>
            </div>
            <div class="card-footer">
                <small class="text-muted">
                 {{ $proyect->created_at->diffForHumans() }}</small>
            </div>
        </div>

        @empty

        <li> Empty </li>


    </div>
@endforelse
</div>

答案 1 :(得分:0)

public function index()
{
    $proyects = Proyect::latest()->paginate(10);
    return view('proyect.index', compact('proyects'));
}

array_chunk是一个PHP函数,可以拼接您的数组。

@forelse(array_chunk($proyects->all(),2) as $rows)
    <div class="row">
        @foreach($rows as $proyect)
            <div class="col-10 col-lg-12 col-md-6">
                <div class="card-deck">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">{{ $proyect->title }}</h5>
                            <h6 class="card-subtitle mb-2 text-muted">{{ $proyect->descripcion }}</h6>
                            <p class="card-text">You can use the cap image as overlay for the body</p>
                            <a href="{{ route('proyect.show', $proyect) }}" class="card-link">Ver mas</a>
                        </div>
                        <div class="card-footer">
                            <small class="text-muted">{{ $proyect->created_at->diffForHumans() }}</small>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>
    @empty
    <div>Empty ...</div>
@endforelse