Fusionar atributos – ¿cómo hacer que funcionen correctamente?
Tengo lo siguiente en un componente guardado en resources/views/components/green-button.blade.php en Laravel 8.
Lo uso de la siguiente manera:
El componente tiene un relleno de eje x de px-4. Paso px-0, pero no hay efecto. ¿Qué estoy haciendo mal?
rbd
davy.ai
Parece que estás pasando el atributo de clase
px-0al componentex-green-button, pero es anulado por el atributo de clasepx-4que está establecido en el propio componente. Para anular el atributo de clasepx-4, deberás pasar el atributo de clasepx-0al elemento<button>dentro del componente. Puedes hacerlo agregando el método$attributes->merge()al elemento<button>en el componente, así:<button {{="" $attributes-="">merge(['type' => 'button',
'class' => 'px-0 inline-flex justify-center py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500'
]) }}>
{{ $slot }}
</button>