无法让 Livewire 事件 Emit 和 Listen 工作

Question

我正在尝试设置一个事件侦听器，以便当子 livewire 组件更新标题时，它会刷新父组件以显示更新，而不必硬刷新页面以查看更新。

这是一个快速 gif，显示正在发生的事情

• https://i.gyazo.com/faefb27c2fe0fb32da097fbbf5cc1acb.mp4

我有 2 个 livewire 组件。

父级 = ViewSidebar.php / view-sidebar.blade.php

// view-sidebar.blade.php
@foreach ($kanbans as $kanban )
   @livewire('kanbans.show-sidebar-kanban', ['kanban'=>$kanban], key($kanban->id))
@endforeach

// ViewSidebar.php
public $kanbans;

protected $listeners = ['refreshKanbans'];
  
public function refreshKanbans()
    {
        $this->kanbans = Kanban::where('status', $this->active)
                            ->orderBy('order', 'ASC')
                            ->get();
    }

public function mount()
    {
        $this->refreshKanbans();
    }

public function render()
    {
        return view('livewire.kanbans.view-sidebar');
    }

在子组件中我设置了这个

public function updateKanban($id)
    {
        $this->validate([
            'title' => 'required',
        ]);

        $id = Kanban::find($id);

        if ($id) {
            $id->update([
                'title' => $this->title,
            ]);
        }

        $this->resetInputFields();

        $this->emit('refreshKanbans');

       
    }

所有文件都在一个名为kanbans 的子文件夹中，这会破坏它吗？

尝试遵循这些文档https://laravel-livewire.com/docs/2.x/events

我也尝试了这种方法，调用了 emit $this->emit('updateKanbanSidebar'); 并像这样设置监听器 protected $listeners = ['updateKanbanSidebar' => 'refreshKanbans'];

显然我对文档的理解有误，但不知道问题出在哪里。

非常感谢任何帮助！

提前谢谢你:)

Answer 1

我能够在子组件中使用它并跳过发射。我能够 DD 并且发射工作正常，但不知道为什么它没有更新。

public function updateKanban($id)
    {
        $this->validate([
            'title' => 'required',
        ]);

        $this->kanban->update(['title' => $this->title]);

        $this->resetInputFields();

        $this->kanban=Kanban::find($this->kanban->id);
       
    }

Answer 2

你的代码有问题，所以让我帮你解决。从子组件发出后（确保这很好）只需要在父组件中有这个

父母

protected $listeners = ['refreshKanbans' => '$refresh'];
  
public function render()
    {
        $this->kanbans = Kanban::where('status', $this->active)
                            ->orderBy('order', 'ASC')
                            ->get();
        return view('livewire.kanbans.view-sidebar');
    }

告诉我