如何检查Blade模板中4类区块字段为空 隐藏text-video等空区块直接展示下一个

解决方案 #

你当前的代码存在逻辑问题：每遍历一个区块数据就会把4种类型的区块全部渲染一次，不符合按区块类型动态渲染的需求。你需要先为每个区块数据增加类型标识，再加上字段非空判断，满足条件才渲染对应区块。

修改后的代码如下（默认你每个$article_block有type字段，值对应4种区块的类名）：

<div class="blocks">
    @foreach($article_blocks as $article_block)
        {{-- 图文区块：标题、正文、主图都不为空才渲染 --}}
        @if($article_block->type == 'text-image' && !empty($article_block->title_1) && !empty($article_block->text_1) && !empty($article_block->main_image))
        <div class="text-image">
            <h2>{{ $article_block->title_1 }}</h2>
            <h3>{{ $article_block->text_1 }}</h3>
            <img src="{{ $article_block->main_image }}" alt="">
        </div>
        @endif

        {{-- 视频区块：正文、视频链接都不为空才渲染 --}}
        @if($article_block->type == 'text-video' && !empty($article_block->text_1) && !empty($article_block->video_link))
        <div class="text-video">
            <h3>{{ $article_block->text_1 }}</h3>
            <h3>{{ $article_block->video_link }}</h3>
        </div>
        @endif

        {{-- 轮播区块：轮播图列表不为空才渲染 --}}
        @if($article_block->type == 'carusel' && !empty($article_block_images) && count($article_block_images))
        <div class="carusel">
            @foreach($article_block_images as $article_block_image)
                <img src="{{ $article_block_image->main_image }}" alt="">
            @endforeach
        </div>
        @endif

        {{-- 双文本区块：两个文本字段都不为空才渲染 --}}
        @if($article_block->type == 'text-text' && !empty($article_block->text_1) && !empty($article_block->text_2))
        <div class="text-text">
            <h3>{{ $article_block->text_1 }}</h3>
            <h3>{{ $article_block->text_2 }}</h3>
        </div>
        @endif
    @endforeach
</div>

补充说明 #

• 如果没有type字段，你可以直接按目标字段判断是否渲染，比如只要video_link为空就不显示视频区块，直接把视频区块的判断条件改成!empty($article_block->video_link)即可。
• 轮播图列表$article_block_images建议和$article_block做关联（比如用$article_block->images调用），避免出现轮播图和当前区块不匹配的问题，判断时可以直接用$article_block->images->isNotEmpty()更符合Laravel的写法。
• Laravel 还提供@isset、@empty等模板指令，可以根据你的习惯简化判断写法。

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