我正在 Laravel 中构建一个博客,但我在我的博客模板中发现了一个问题,从路由文件中我通过紧凑发送 post 变量:
Route::get('/blog', function () {
$posts = App\Post::latest('published_at')->get();
return view('blog', compact('posts'));
});
从我的观点来看,我实现了一个@foreach
:
<!-- Blog -->
<div class="section blog-posts" id="blog-section">
@foreach($posts as $post)
<div class="row">
<div class="col col-m-12 col-t-6 col-d-6">
<div class="blog_item animated">
<div class="image">
<a href="blog-page.html"><img src="mcard/images/blog/blog1.jpg" alt="" /></a>
</div>
<div class="content-box">
<div class="i_title">
<div class="icon"><strong>{{ $post->published_at->format('d') }}</strong> {{ $post->published_at->format('M') }}</div>
</div>
<div class="category_bts">
@foreach($post->tags as $tag)
<a href="#" class="category">#{{ $tag->name }}</a>
@endforeach
</div>
<a href="blog-page.html" class="name">{{ $post->title }}</a>
<p>
{{ $post->excerpt }}
</p>
<a href="blog-page.html" class="btn btn_animated"><span class="circle">Leer más</span></a>
</div>
</div>
</div>
<div class="col col-m-12 col-t-6 col-d-6">
<div class="blog_item animated">
<div class="image">
<a href="blog-page.html"><img src="mcard/images/blog/blog1.jpg" alt="" /></a>
</div>
<div class="content-box">
<div class="i_title">
<div class="icon"><strong>{{ $post->published_at->format('d') }}</strong> {{ $post->published_at->format('M') }}</div>
</div>
<div class="category_bts">
@foreach($post->tags as $tag)
<a href="#" class="category">#{{ $tag->name }}</a>
@endforeach
</div>
<a href="blog-page.html" class="name">{{ $post->title }}</a>
<p>
{{ $post->excerpt }}
</p>
<a href="blog-page.html" class="btn btn_animated"><span class="circle">Leer más</span></a>
</div>
</div>
</div>
</div>
@endforeach
</div>
问题是,对于每一行(行)应该有 2 个帖子,如果我将 foreach 放置在我放置它的位置,对于每一行,我将重复相同的帖子两次。
解决如下:
也就是说,段
它所做的是拆分 $posts 数组并将其 2 x 2 放置在另一个名为 $post 的数组中,这就是为什么必须稍后放置这个其他段
在从 2 到 2 的排列中,我们将从 1 到 1 进行排列,以便它适应模板。
为什么不简单地在行打印列内部迭代呢?当列超过 12 个单位的限制时,它们应该打印在下面,直观地表明它是另一行,如果你有空格并且列没有正确填充,这已经是你的风格的问题了。对于您正在做的事情,您的帖子应该具有相同的高度,如果没有,我认为这将是糟糕的界面设计。
您的代码应如下所示: