奇怪的 Livewire + Turbolinks 行为

问题描述

我正在 TALL (Laravel 7) + Turbolinks 中构建一个管理面板。一个部分仅包含一个 Livewire 组件，该组件显示 Product 元素的分页表和一个搜索字段（在此之前我正在做的唯一“奇怪”的事情是将 Market 模型实例注入请求在中间件中）。

问题出现在/products路径中，其中livewire组件包含什么不起作用...第一页的记录没问题，但分页链接已死，搜索字段无任何作用,没有控制台错误，没有 livewire 错误，就像 javascript 根本不起作用一样，这是最奇怪的事情：如果我重新加载页面，我在中间件中加载的 Market 数据被添加到查询字符串中一切都开始按预期工作。

中间件：

public function handle($request,Closure $next) {
    $market = Market::findOrFail(session('selected_market'));
    $request->request->add(['market' => $market]);
    return $next($request);
}

Livewire 组件：

class ProductsTable extends Component{
    use WithPagination;

    public $search = '';
    protected $queryString = [
        'search' => ['except' => ''],'page' => ['except' => 1],];

    public function render(){
        $products = Product::where('market_id',request('market')->id)
        ->when($this->search !== '',function($query) {
            $query->where('name','like',"%{$this->search}%");
            $query->orWhere('brand',"%{$this->search}%");
        })->paginate(15);

        return view('livewire.products-table',['products' => $products]);
    }
}

Livewire 组件视图：

<input wire:model.debounce.500ms="search" type="search" name="search" id="search">

<table>
    @forelse($products as $product)
        <tr onclick="Turbolinks.visit('{{ route('product',$product->id) }}')">
            <td>{{ $product->name }}</td>
            ...
        </tr>
    @empty
        <tr><td>nothing to show for {{ $search }}</td></tr>
    @endforelse
</table>

{{ $products->links() }}

我真的很困惑和厌倦，我不知道发生了什么，类似的问题也没有得到清楚的回答。

谢谢

解决方法

解决方案就像将其添加到您的脚本中一样简单：

document.addEventListener("turbolinks:load",function(event) {
  window.livewire.restart();
});