PHP/Laravel如何根据数据库返回值动态修改表格td元素的文本颜色

实现步骤说明 #

1. 修正控制器逻辑

原有控制器存在两个问题：一是重复执行TaskType::all()全表查询，性能损耗大；二是计算得到的$color是单一值，无法对应列表中每一条数据的不同事件类型。修改后代码如下：

public function index()
{
    // 从TaskType表构建事件-颜色映射数组，格式为['START' => '#4f5705', ...]
    $eventColorMap = TaskType::pluck('colors', 'event')->toArray();
    
    // 保留你原有获取$welcome列表的逻辑
    $welcome = 你原有获取$welcome数据的代码;

    // 将数据和映射关系传到视图
    return view('你的视图文件名', compact('welcome', 'eventColorMap'));
}

2. 修改Blade视图动态绑定颜色

只需要调整事件列的td标签，增加style属性读取对应颜色即可，同时顺手补全原有未闭合的table标签、增加thead语义化标签：

<div class="row" style="margin-top: 210px;">
    <table class="table">
        <thead>
            <tr>
                <th>Program Time</th>
                <th>Event</th>
                <th>Message</th>
                <th>Actual_time</th>
                <th>Display_Message</th>
            </tr>
        </thead>
        <tbody>
        @foreach($welcome as $key => $data)
            <tr>    
                <td>{{$data->program_time}}</td>
                <!-- 动态设置事件文字颜色，??后为兜底默认色，避免未定义事件报错 -->
                <td style="color: {{ $eventColorMap[$data->event] ?? '#000000' }}">{{$data->event}}</td>
                <td>{{$data->message}}</td> 
                <td>{{$data->actual_time}}</td>               
                <td>{{$data->display_message}}</td>                  
            </tr>
        @endforeach
        </tbody>
    </table>
<div>

如果你的颜色规则固定不需要从数据库读取，也可以直接在Blade里写判断逻辑，不需要修改控制器：

<td style="color: @switch($data->event)
    @case('START') #4f5705 @break
    @case('STOP') #f43f1a @break
    @case('REPORT') #8acae7 @break
    @default #000000
@endswitch">{{$data->event}}</td>

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