本文介绍如何在 Laravel 中将数据库查询结果按 service_category 分类聚合，并在 Blade 模板中以「分类标题 + 子项列表」结构清晰呈现，既支持控制器预处理分组，也兼顾可读性与性能优化。
本文介绍如何在 laravel 中将数据库查询结果按 `service_category` 分类聚合，并在 blade 模板中以「分类标题 + 子项列表」结构清晰呈现，既支持控制器预处理分组，也兼顾可读性与性能优化。
在实际开发中，直接遍历扁平化的服务列表（如 $services）虽简单，但难以体现业务逻辑层级。若需按 service_category 分组展示（例如“设计服务”“开发服务”“运维服务”各自展开），强烈推荐在控制器中完成数据分组——这比在 Blade 中使用 @php 指令处理更符合 MVC 原则，也更利于测试、复用和维护。
✅ 推荐做法：控制器中预分组（清晰、高效、可测试）
首先优化控制器方法，使用 Laravel Query Builder 替代原始 SQL，并在返回视图前完成分组：
public function order_services()
{
$services = DB::table('services')
->select('id', 'service_name', 'service_category', 'service_price')
->orderBy('service_category') // 确保同类别数据相邻（非必需但利于调试）
->get();
// 按 service_category 键名分组，构建关联数组：['设计' => [$svc1, $svc2], '开发' => [...]]
$groupedServices = $services->groupBy('service_category')->map(function ($items) {
return $items->values(); // 重置索引，避免空键干扰
})->all();
return view('guests/services', ['servicesByCategory' => $groupedServices]);
}? 提示：$services->groupBy() 是 Laravel Collection 的原生方法，比手动 foreach 更简洁安全，且自动处理空类别、重复键等边界情况。
?️ Blade 模板渲染：语义化结构 + 避免 ID 重复
在 resources/views/guests/services.blade.php 中，遍历分组数据并渲染：
@foreach ($servicesByCategory as $category => $services)
<h3 class="mt-4 text-primary">{{ ucfirst($category) }}</h3>
<ul class="list-group mb-4" id="category-{{ Str::slug($category) }}">
@foreach ($services as $service)
<!-- 类别标题项 -->
<li class="list-group-item d-flex justify-content-between align-items-center border border-danger">
<span style="font-size:24px; color:red">
<i class="bi bi-check-circle"></i>
</span>
<span style="font-weight:bold">{{ $category }}</span>
<span><u><i class="bi bi-magic"></i></u></span>
</li>
<!-- 具体服务项 -->
<li class="list-group-item d-flex justify-content-between align-items-center">
<span class="product_name" style="font-size:24px; color:#870FD1">
<i class="bi bi-plus-circle"></i>
</span>
<span class="product_name"
data-price="{{ $service->service_price }}"
data-category="{{ $category }}"
data-id="{{ $service->id }}">
{{ $service->service_name }}
</span>
<span class="text-success"><u>Available</u></span>
</li>
@endforeach
</ul>
@endforeach⚠️ 关键注意事项
- 禁止重复 ID 属性：原代码中 id="service_category" 和 id="service_name" 在循环内多次出现，违反 HTML 规范（ID 必须唯一）。已改为使用 class 或 data-* 属性替代，确保前端 JS 交互（如点击添加服务）仍可通过 data-category 精准获取上下文。
-
样式解耦建议：将内联 style 移至 CSS 文件，例如：
.category-header { font-weight: bold; color: #e74c3c; } .service-item { color: #870FD1; } -
空类别兜底处理：若数据库存在空字符串或 NULL 类别，可在分组前过滤：
$services = $services->filter(fn($s) => !blank($s->service_category));
✅ 总结
分组展示不是 Blade 的职责，而是数据准备阶段的逻辑。通过控制器中使用 Collection::groupBy() 预处理，再配合语义化的 Blade 循环，既能保证模板简洁可读，又能提升整体架构的健壮性与可扩展性。后续如需支持搜索、折叠/展开、AJAX 加载等增强功能，此结构也天然友好。
