更改 laravel blade 组件道具的默认值不起作用

Question

我正在尝试按照 laravel 组件道具系列的指南进行操作。

我正在尝试将 1 的值传递给组件以设置颜色。

<x-button.kanban-tag name="{{$tag->title}}" color_id="1"/>

@props([
    'name' => 'New Tag',
    'color_id' => '3',
    'colors' => [
        '1' => 'bg-blue-500 hover:bg-blue-600 text-white',
        '2' => 'bg-red-500 hover:bg-red-600 text-white',
        '3' => 'bg-indigo-500 hover:bg-indigo-600 text-white',
        '4' => 'bg-green-500 hover:bg-green-600 text-white',
        '5' => 'bg-yellow-500 hover:bg-yellow-600 text-white'
    ],
 
])

<div {{ $attributes->merge(['class' => "{$colors[$color_id]} flex space-x-1 border rounded px-2 py-1 m-1 transition duration-500 ease select-none focus:outline-none focus:shadow-outline text-sm font-semibold tracking-widest"]) }} >
        {{$name}}
</div>

但是正在渲染的颜色是 3 的默认值，在这种情况下是靛蓝。

这是我正在关注的示例，所以我不明白问题是什么 =/

老实说，不明白为什么 name 的道具有效，但 color_id

Answer 1

如果您使用 @props，您应该删除组件 class 形式 App/View/Components。

还有一个原因。使用 camelCase 属性名称。而不是 color_id 试试 colorId.

更改 laravel blade 组件道具的默认值不起作用

Changing default value of laravel blade component props not working

components

laravel

laravel-blade