Laravel livewire 不发出事件

Question

我正在尝试在我的 Laravel 解决方案中为 livewire 组件创建一个小型 toast 消息调度程序，但事件发射不起作用。

我有 ToastMessage.php 文件和此代码

namespace App\Http\Livewire;

use Livewire\Component;

class ToastMessage extends Component
{
    protected $listeners = ['showToast' => 'showToast'];

    public $alertTypeClasses = [
        'success' => ' bg-green-500 text-white',
        'warning' => ' bg-orange-500 text-white', 
        'danger' => ' bg-red-500 text-white', 
    ];

    public $message = 'Notification Message';

    public $alertType = 'success';
    
    public function render()
    {
        return view('livewire.toast');
    }

    public function showToast($message, $alertType)
    {
        $this->message = $message;
        $this->alertType = $alertType;

        $this->dispatchBrowserEvent('toast-message-show');
    }
}

和这个对应的模板

<div class="fixed top-0 right-0 inset-x-0 mb-6 mx-6 px-6 py-5 max-w-sm rounded-lg pointer-events-auto {{ $alertTypeClasses[$alertType] }}"
    x-data="{show:false}" @toast-message-show.window="show = true; setTimeout(() => show=false, 5000);" x-show="show" x-cloak>
    {{ $message }}
</div>

我尝试在另一个组件中保存一些数据后显示吐司，如下所示：

public function save()
{
    // saving my data, this works

    $this->emit('showToast', 'Your data has been saved', 'success');
}

问题是 $this->emit 不起作用。我没有得到任何错误或任何东西。我什至可以添加一些乱码作为发射参数，它甚至不会崩溃。

我错过了什么。 Livewire 的文档在调试方面存在不足

Answer 1

你可以做得更简单。创建一个 blade 文件，例如 partials/flash-messages.php

@if ($message = Session::get('success'))
    <div class="fixed top-0 right-0 inset-x-0 mb-6 mx-6 px-6 py-5 max-w-sm rounded-lg pointer-events-auto bg-green-500 text-white">
    {{ $message }}
</div>
@endif

@if ($message = Session::get('warning'))
    <div class="fixed top-0 right-0 inset-x-0 mb-6 mx-6 px-6 py-5 max-w-sm rounded-lg pointer-events-auto bg-orange-500 text-white">
    {{ $message }}
</div>
@endif

@if ($message = Session::get('danger'))
    <div class="fixed top-0 right-0 inset-x-0 mb-6 mx-6 px-6 py-5 max-w-sm rounded-lg pointer-events-auto bg-red-500 text-white">
    {{ $message }}
</div>
@endif

在您的 blade 组件中

@if(session()->has('message'))
   @include('partials.flash-messages')
@endif

并在组件中

public function save()
{
   //....
   session()->flash('success', 'This is the message');
}

Laravel livewire 不发出事件

Laravel livewire does not emit events

eventemitter

laravel-livewire

laravel-8