如何根据子菜单是否存在为下拉菜单项动态显示右拉图标

解决方案 #

你当前代码的核心问题是判断条件错误：Laravel的一对多关联在没有匹配数据时，返回的是空的Collection集合对象，而非null，所以is_null($subcontinent->countries)永远不会成立，导致所有菜单项都会显示右拉图标。

你只需要将判断条件修改为判断集合是否为空即可：

@if($subcontinent->countries->isEmpty())
{{-- 没有关联国家，不显示图标 --}}
<button class="dropbtn2">{{$subcontinent->subcontinent_name}}</button>
@else
{{-- 有关联国家，显示右拉图标 --}}
<button class="dropbtn2">{{$subcontinent->subcontinent_name}}<i class="fa fa-caret-right pl-3" aria-hidden="true"></i></button>
@endif

额外优化建议

1. 你在控制器中获取$subcontinents列表时，建议使用预加载关联的写法$subcontinents = Subcontinent::with('countries')->get();，可以避免循环时产生N+1查询问题，提升页面加载性能。
2. 没有关联国家的次大陆，对应的子菜单容器dropdown-content2也不需要输出，可以在外层加个判断，减少无用的DOM节点：

@if(!$subcontinent->countries->isEmpty())
<div class="dropdown-content2">
  @foreach($subcontinent->countries as $division)
    <a href="" >{{$division->country_name}}</a>
  @endforeach
</div>
@endif

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