병합 특성이 나 어떻게 그들이 제대로 작동?

Question 1

나는 다음과 같은 구성 요소에 저장 resources/views/components/green-button.blade.php 에 laravel8.

<button {{ $attributes->merge(['type' => 'button', 'class' => 'px-4 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>

나는 그것을 사용:

<x-green-button class="px-0"
                title="Click to show or hide data entry for {{$person->firstname}}."
                wire:click="toggleVisibility({{$person->id}})">
  <h3 class="my-1">{{$person->FullName_fh}}</h3>
</x-green-button>

구 x 축 패딩의 px-4. 내가 전달 px-0 하지만 아무런 효과가 없습니다. 무엇이 잘못된 것입니까?

rbd

Question 2

당신이 사용할 수 있는 @props() 을 달성하는 목표입니다.

// In your component

@props(['customClass' => ''])

<button {{ $attributes->merge([
    'type'  => 'button', 
    'class' => 'all-your-classes ' . $customClass
]) }}>
    {{ $slot }}
</button>

// In your blade file

<x-green-button customClass="px-0">
    {{ $person->FullName_fh }}
</x-green-button>

Samuel Ferdary · Answer 1 · 2021-11-18T22:15:11

당신이 사용할 수 있는 @props() 을 달성하는 목표입니다.

// In your component

@props(['customClass' => ''])

<button {{ $attributes->merge([
    'type'  => 'button', 
    'class' => 'all-your-classes ' . $customClass
]) }}>
    {{ $slot }}
</button>

// In your blade file

<x-green-button customClass="px-0">
    {{ $person->FullName_fh }}
</x-green-button>

안녕하세요,thx. 면'모든 당신의 클래스'는'px-4',그리고$customClass='px-0 며,'px-4 보다 우선하기 때문에 그것이 첫째로 오는가?, 나는 지난 모순되는 클래스 우선적으로 적용됩니까? Thx S.
@RobertBryanDavis 에 따라 달라 스타일 순서를 참조하십시오: stackoverflow.com/a/3066365/13916713
안녕하세요,thx 에 대한 피드백입니다. 나를 얻 funcctionality 내가 찾았을 사용하여 소품()및 전달에서 조정하는 방법입니다.

병합 특성이 나 어떻게 그들이 제대로 작동?

질문

최고의 응답

다른 언어로

이 페이지는 다른 언어로되어 있습니다

이 카테고리에서 인기

인기 있는 질문에 이 카테고리