Laravel一对多关联查询：如何在Blade模板展示客户关联项目

没问题，咱们来实现你要的这个表格展示效果。首先得确保从控制器里高效获取数据，然后在Blade模板里利用HTML的rowspan属性来实现客户信息跨多行显示，正好匹配你要的格式。

第一步：控制器里预加载关联数据 #

为了避免N+1查询性能问题，咱们在查询客户的时候预加载对应的项目，这样能减少数据库查询次数：

// 比如在你的ClientsController中
public function index()
{
    // 预加载projects关联，一次性获取所有客户及对应项目
    $clients = \App\Model\Admin\Client::with('projects')->get();
    return view('admin.clients.list', compact('clients'));
}

第二步：Blade模板里渲染表格 #

接下来在Blade模板中，通过循环客户和对应的项目，利用rowspan让客户的基础信息跨所有项目行显示，完美呈现你要的格式：

<!-- 加一点基础样式让表格更美观易读 -->
<style>
    table {
        border-collapse: collapse;
        width: 100%;
        margin: 2rem 0;
    }
    th, td {
        border: 1px solid #e2e8f0;
        padding: 0.75rem;
        text-align: left;
    }
    th {
        background-color: #f8fafc;
        font-weight: 600;
    }
</style>

<table>
    <thead>
        <tr>
            <th>id</th>
            <th>客户名称</th>
            <th>客户公司</th>
            <th>联系电话</th>
            <th>项目列表</th>
        </tr>
    </thead>
    <tbody>
        @foreach($clients as $client)
            @php
                $projectCount = $client->projects->count();
                $isFirstProject = true;
            @endphp

            <!-- 循环客户的每个项目 -->
            @foreach($client->projects as $project)
                <tr>
                    <!-- 仅第一个项目行显示客户基础信息，设置rowspan跨所有项目行 -->
                    @if($isFirstProject)
                        <td rowspan="{{ $projectCount }}">{{ $client->id }}</td>
                        <td rowspan="{{ $projectCount }}">{{ $client->name }}</td>
                        <td rowspan="{{ $projectCount }}">{{ $client->company }}</td>
                        <td rowspan="{{ $projectCount }}">{{ $client->phone }}</td>
                        @php $isFirstProject = false; @endphp
                    @endif
                    <!-- 每行显示对应项目名称 -->
                    <td>{{ $project->name }}</td>
                </tr>
            @endforeach

            <!-- 处理客户没有项目的边界情况 -->
            @if($projectCount === 0)
                <tr>
                    <td>{{ $client->id }}</td>
                    <td>{{ $client->name }}</td>
                    <td>{{ $client->company }}</td>
                    <td>{{ $client->phone }}</td>
                    <td>无关联项目</td>
                </tr>
            @endif
        @endforeach
    </tbody>
</table>

这样渲染出来的表格完全符合你的需求：每个客户的基础信息只在第一行展示，下方的行仅显示对应的项目名称，视觉上和你给出的示例格式完全一致，同时还处理了客户无项目的特殊情况。

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