如何通过外键id_kategori过滤Laravel的@foreach循环菜单数据？

希望通过Menu表的id_kategori外键过滤菜单数据，实现#menu-rice标签页仅展示id_kategori=1的对应菜单。

<li class="nav-item" role="presentation">
  <a class="active show" data-bs-toggle="tab" data-bs-target="#menu-rice" aria-selected="false "role="tab">                
    <div>
       <i class="fa-solid fa-bowl-rice"></i>
       <h6>Rice</h6>
     </div>
   </a>
</li>
........

<div class="tab-pane fade active show" id="menu-rice" role="tabpanel">
  <div class="tab-header text-center">
    <h3>Rice</h3>
  </div>
  <div class="row">
    @foreach ($ar_menu as $row)
      <div class="col-lg-6 menu-item">
        @empty($row->foto)
          <img src="{{ url('/public/assets/img/menu/placeholder.jpg') }}"alt="Menu" class="menu-img">
        @else
          <img src="{{ url('/public/assets/img/menu')}}/{{$row->foto}}"alt="Menu" class="menu-img">
        @endempty
        <div class="menu-content"> 
          <a href="#">{{ $row->nama }}</a><span>{{ $row->harga }}</span>
        </div>
        <div class="menu-ingredients ps-2">
          {{ $row->ket }}
        </div>
      </div>
    @endforeach
  </div>
</div>

Menu表 #

Kategori表 #

有两种实现方式，推荐使用后端过滤以提升性能：

方式1：后端控制器过滤（推荐） #

在控制器中查询菜单数据时，直接添加id_kategori=1的过滤条件，只返回需要的数据：

// 控制器代码示例（Laravel Eloquent）
$ar_menu = \App\Models\Menu::where('id_kategori', 1)->get();

// 将数据传递到视图
return view('你的视图名称', compact('ar_menu'));

这种方式只会把分类1的菜单数据传到前端，减少数据传输量，更高效。

方式2：前端Blade模板过滤 #

如果不想修改后端代码，可直接在Blade模板的循环中添加条件判断，仅渲染id_kategori=1的菜单：

<div class="row">
  @foreach ($ar_menu as $row)
    @if($row->id_kategori == 1) <!-- 新增过滤条件 -->
      <div class="col-lg-6 menu-item">
        @empty($row->foto)
          <img src="{{ url('/public/assets/img/menu/placeholder.jpg') }}"alt="Menu" class="menu-img">
        @else
          <img src="{{ url('/public/assets/img/menu')}}/{{$row->foto}}"alt="Menu" class="menu-img">
        @endempty
        <div class="menu-content"> 
          <a href="#">{{ $row->nama }}</a><span>{{ $row->harga }}</span>
        </div>
        <div class="menu-ingredients ps-2">
          {{ $row->ket }}
        </div>
      </div>
    @endif
  @endforeach
</div>

这种方式适合快速调试，但会把所有菜单数据传到前端，性能略差。

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