Livewire 3.5.2中Dispatch事件未被接收的问题排查求助

我在Livewire v3.5.2中遇到Dispatch事件无响应的问题：表单更新数据库数据后，执行dispatch('refreshValas')事件，但主组件无法接收该事件。日志显示事件已成功派发，但监听器未触发。

相关代码 #

表单组件的updateValas方法 #

public function updateValas()
{
    $this->validate();

    try {
        Valas::find($this->editingId)->update($this->editingValas);
        $this->closeEditModal();
        session()->flash('message', 'Data Valas berhasil diperbarui.');
        $this->dispatch('refreshValas');  // 派发事件以更新数据
    } catch (\Exception $e) {
        session()->flash('error', 'Terjadi kesalahan saat memperbarui data.');
    }
}

主组件的监听器配置（第一种方式） #

protected $listeners = [
    'refreshCounterRates' => 'refreshCounterRates',
    'refreshVideo' => 'refreshVideo',
    'refreshImage' => 'refreshImage',
    'refreshValas' => 'refreshValas',
];

public function refreshValas()
{
    \Log::info('refreshValas event received');
    $valas = Valas::all()->toArray();
    $totalValas = count($valas);
    $halfCount = ceil($totalValas / 2);

    $this->valasTable1 = array_slice($valas, 0, $halfCount);
    $this->valasTable2 = array_slice($valas, $halfCount);
}

public function mount($playlistId)
{
    $this->playlistId = $playlistId;
    $this->refreshQueue();
    $this->refreshValas();
    $this->refreshCounterRates();
    $this->refreshVideo();
    $this->updateDateTime();
    $this->updateLastUpdateTime();
    $this->refreshImage();
}

尝试的第二种监听方式（Attribute注解） #

#[On('refresh-valas')] 
public function refreshValas()
{
    \Log::info('refreshValas event received');
    $valas = Valas::all()->toArray();
    $totalValas = count($valas);
    $halfCount = ceil($totalValas / 2);

    $this->valasTable1 = array_slice($valas, 0, $halfCount);
    $this->valasTable2 = array_slice($valas, $halfCount);
}

触发updateValas的表单HTML代码 #

<!-- Edit Modal -->
<div x-show="$wire.isEditModalOpen" class="fixed inset-0 z-10 overflow-y-auto" aria-labelledby="modal-title" role="dialog" aria-modal="true">
    <div class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" aria-hidden="true"></div>
        <span class="hidden sm:inline-block sm:align-middle sm:h-screen" aria-hidden="true">&#8203;</span>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
                <h3 class="text-lg font-medium leading-6 text-gray-900" id="modal-title">Edit Valas</h3>
                <div class="mt-2">
                    <label for="buy" class="block text-sm font-medium text-gray-700 mb-1">Kode ISO Valas</label>
                    <input wire:model="editingValas.kode_iso_valas" class="block w-full pl-3 pr-4 py-3 rounded-md bg-gray-50 border-transparent focus:border-blue-500 focus:bg-white focus:ring-0 transition duration-200 ease-in-out shadow-sm hover:shadow-md" type="text" placeholder="Kode ISO Valas">
                    @error('editingValas.kode_iso_valas') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                    <label for="buy" class="block text-sm font-medium text-gray-700 mb-1">Kode Valas</label>
                        <input wire:model="editingValas.kode_valas" class="block w-full pl-3 pr-4 py-3 rounded-md bg-gray-50 border-transparent focus:border-blue-500 focus:bg-white focus:ring-0 transition duration-200 ease-in-out shadow-sm hover:shadow-md" type="text" placeholder="Kode Valas">
                        @error('editingValas.kode_valas') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                    <label for="buy" class="block text-sm font-medium text-gray-700 mb-1 mt-3">Beli</label>
                    <div class="relative">
                        <span class="absolute inset-y-0 left-0 pl-3 flex items-center ">
                            Rp
                        </span>
                        <input wire:model="editingValas.beli" class="block w-full pl-10 pr-4 py-3 rounded-md bg-gray-50 border-transparent focus:border-blue-500 focus:bg-white focus:ring-0 transition duration-200 ease-in-out shadow-sm hover:shadow-md" type="text" placeholder="Beli">
                        @error('editingValas.beli') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                    </div>
                    <label for="sell" class="block text-sm font-medium text-gray-700 mb-1 mt-3">Jual</label>
                    <div class="relative">
                        <span class="absolute inset-y-0 left-0 pl-3 flex items-center ">
                            Rp
                        </span>
                        <input wire:model="editingValas.jual" class="block w-full pl-10 pr-4 py-3 rounded-md bg-gray-50 border-transparent focus:border-blue-500 focus:bg-white focus:ring-0 transition duration-200 ease-in-out shadow-sm hover:shadow-md" type="text" placeholder="Jual">
                        @error('editingValas.jual') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                    </div>
                </div>
            </div>
            <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
                <button wire:click="updateValas" type="button" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
                    Update
                </button>
                <button wire:click="closeEditModal" type="button" class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
                    Cancel
                </button>
            </div>
        </div>
    </div>
</div>

内容的提问来源于stack exchange，提问作者Sultan Zaki