Laravel Blade中Article模型quote类型渲染不同卡片样式问题排查

• 错误1：Blade中$articles是控制器传入的全量文章集合（Article::all()返回的是Collection对象），直接调用$articles->type不存在该属性，判断条件永远不成立，所以quote卡片不会渲染
• 错误2：现有逻辑是先全量渲染所有文章为默认卡片，再单独循环渲染quote类型文章，会导致quote类型文章重复显示，不符合需求
• 错误3：newsSecondLine区块下的quote循环错误使用了$newsFirstLine作为数据源，即使判断生效也会渲染第一行的quote内容，和第二行数据无关
• 额外性能问题：控制器中$articles = Article::all()查询全表无实际作用，会造成不必要的数据库性能开销，可直接删除

第一步：修改控制器代码 #

删除无用的全表查询语句，优化后代码：

public function news()
{
    $newsFirstLine = Article::allNews()->get()->take(8);
    $newsSecondLine = Article::allNews()->FilterContent($newsFirstLine->pluck('id'))->get();
    $populars = Article::popular();
    return view('pages/news/news-list', compact('newsFirstLine', 'newsSecondLine', 'populars'));
}

第二步：修改Blade模板代码 #

循环每篇文章时当场判断类型，选择对应卡片渲染，不需要额外的外层判断和二次循环：

<div class="container w-100 d-block d-xs-none">
    <div class="d-flex w-100">
        <span class="fas fa-yellow-bullet text-yellow pr-10px font-size-20"></span>
        <div class="font-size-20 font-size-xs-16 font-bold-caps text-blue-100">@tr('web.news')</div>
    </div>
    <div class="row">
        @foreach($newsFirstLine as $news_item)
            @if($news_item->type == 'quote')
                @include("cards/quote", [
                'slug' => $news_item->getUrl(),
                'title' => $news_item->tr('title'),
                'avatar' => $news_item->respondent->image,
                'publicPerson' => $news_item->respondent->tr('name'),
                'created' => $news_item->created_at->format('d.m.Y'),
                'createdHi' => $news_item->created_at->format('H:i'),
                ])
            @else
                @include("cards/interviews", [
                'image' => $news_item->image,
                'slug' => $news_item->getUrl(), 
                'title' => $news_item->tr('title'), 
                'created' => $news_item->created_at->format('d.F.Y'),
                'createdHi' => $news_item->created_at->format('H:i'),
                ])
            @endif
        @endforeach
    </div>
</div>
@include("home.popularNews")
<div class="container w-100">
    <div class="row">
        @foreach($newsSecondLine as $news_item)
            @if($news_item->type == 'quote')
                @include("cards/quote", [
                'slug' => $news_item->getUrl(),
                'title' => $news_item->tr('title'),
                'avatar' => $news_item->respondent->image,
                'publicPerson' => $news_item->respondent->tr('name'),
                'created' => $news_item->created_at->format('d.m.Y'),
                'createdHi' => $news_item->created_at->format('H:i'),
                ])
            @else
                @include("cards/interviews", [
                'image' => $news_item->image,
                'slug' => $news_item->getUrl(),
                'title' => $news_item->tr('title'),
                'created' => $news_item->created_at->format('d.m.Y'),
                'createdHi' => $news_item->created_at->format('H:i'),
                ])
            @endif
        @endforeach
    </div>
</div>

内容的提问来源于stack exchange，提问作者Bochorishvili Nikusha