未触发 Livewire 发射

Question

我试图在单击编辑按钮时显示模式，所以我添加了wire:click：

    <td class="py-3 px-6 text-left">
        <div class="flex items-center">
            <span class="font-medium">{{ $project->project }}</span>
        </div>
    </td>

    <td class="py-3 px-6 text-left">
        <div class="flex items-center">
            <span>{{ $project->username }}</span>
        </div>
    </td>
    
    <td class="py-3 px-6 text-center">
        <span class="bg-{{ $project->status_color }}-200 text-{{ $project->status_color }}-600 py-1 px-3 rounded-full text-xs"> {{ $project->status_name }} </span>
    </td>

    <td class="py-3 px-6 text-center">
        <div class="flex item-center justify-center">

        <button class="bg-indigo-500 hover:bg-indigo-700 text-white font-bold py-1 px-4 rounded" wire:click="edit">
          edit
        </button>

        </div>
    </td>
</tr>

这是我的组件：

use Livewire\Component;

class Dashboard extends Component {
    use WithPagination;

    public function edit() {
        $this->emit('eModal');
    }
}

在按钮所在的 livewire 刀片内部，我为按钮添加了模式和脚本：

<!-- Modal -->
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

@push('scripts')

<script>
   Livewire.on('eModal', () =>{
     console.log('scsa');
  $('#editModal').modal('show');
});
</script>

@endpush

我在脚本中添加了console.log，所以我可以查看是否触发了发射，但没有任何反应，我的控制台上什么也没有。 我试过dispatchBrowserEvent，但结果相同；什么都没有发生。

有人可以帮助我吗？谢谢！

Answer 1

尝试在您的主刀片文件中添加 livewire 事件：

    <script>
    Livewire.on('eModal', () =>{
      console.log('scsa');
      $('#editModal').modal('show');
    });
   </script>