覆盖 Laravel 11 组件的默认属性

Question

我是 Laravel 的新手，最近遇到了这个问题。我想覆盖 Laravel 11 组件的背景，但我只是添加一个未渲染的额外类，即背景不会改变。

我该如何解决这个问题？例如：

<div {{$attributes->merge(['class' => 'bg-blue-100'])}}>
    {{$slot}}
</div>


<x-card class="bg-black">
...
</x-card>

我最终得到的是 class="bg-blue-100 bg-black" 而不是 class="bg-black"。除了 bg-blue-100 之外还有其他的吗，因为我想要一个默认背景。

谢谢

Answer 1

可以使用组件变量来解决这个问题。

// card.blade.php
@props(['bgColor' => 'bg-blue-100'])
<div {{$attributes->merge(['class' => $bgColor])}}>
    {{$slot}}
</div>

// view.blade.php
<x-card bgColor='bg-black'>
...
</x-card>