Laravel Livewire 搜索按钮而不是实时搜索

Question

是否可以在 Laravel Livewire 中使用搜索按钮而不进行实时搜索？我的方法是将 Alpine 与 Livewire 一起使用。但我没有将搜索词注入 $emit 事件：/

<div x-data="{ search: '' }">
  <input type="text" placeholder="Search ..." x-model="search" />
  <span x-text="search"></span>
  <button wire:click="$emit('test', search )">Search</button>
</div>

Answer 1

O.K。 ...很简单^^

只需将$emit('test', search)更改为window.livewire.emit('test', search)

<div x-data="{ search: '' }">
  <input type="text" placeholder="Search ..." x-model="search" />
  <span x-text="search"></span>
  <button x-on:click="window.livewire.emit('test', search)">Search</button>
</div>

Answer 2

或者如果您在循环中使用 livewire 组件。上面的 window.livewire.emit 将调用具有相同函数名称的所有循环 livewire 组件 class。

所以最好的做法是使用

x-on:click="@this.call('functionNameInLivewireComponent', search)"

Laravel Livewire 搜索按钮而不是实时搜索

Laravel Livewire search button instead of live search

laravel-livewire

alpine.js