1

3 つの livewire コンポーネントとUserIsExpired、各コンポーネントに対応する 3 つのボタンがあります。ボタンをクリックすると、前のコンポーネントがそれぞれのコンポーネントに置き換えられます。UserIsActiveUserIsPending

<button wire:click="$emit(active)">{{ __('Active') }}</button>
<button wire:click="$emit(pending)">{{ __('Pending') }}</button>
<button wire:click="$emit(expired)">{{ __('Expired') }}</button>

ビューで

<livewire:user-is-active :active="$active"/>
<livewire:user-is-pending :pending="$pending"/>
<livewire:user-is-expired :expired="$expired"/>

コンポーネント例

class UserIsExpired extends Component
{
    protected $listeners = ['expired'];    
    public function render()
    {
        return <<<'blade'
            <div>
                {{-- The best athlete wants his opponent at his best. --}}
            </div>
        blade;
    }
}

ボタンをクリックするActiveと、コンポーネントがロードされUserIsActiveます。他の2つも同様です。

私は長い間 livewire doc を探していましたが、それを実現する方法を見つけることができませんでした。前もって感謝します。

4

3 に答える 3