在 pjax 重新分配容器后，Laravel livewire click 未执行

问题描述

我在我的应用程序中使用了 pjax。最近我添加了 livewire，我不知道如何让它们一起工作。我的问题：

我有一个包含产品的网格，并且在单击按钮时无限滚动，这会调用数据的特定 URL。

<div>
    <button wire:click="loadMore" class="bg-blue-500">Show more</button>
</div>

一切都很完美，我点击了一些过滤器（例如“按降序排序”）。我的容器重新加载（使用 pjax），当我点击“显示更多”按钮时，它没有调用任何东西。

这是我的主要布局：

<!DOCTYPE html>
<html lang="en">
<head>
    <Meta charset="UTF-8">
    <title>Title</title>
    @livewireStyles
</head>
<body>
<div id="pjax-container">
    <!--  THIS CONTENT RELOADS  -->
    <!--  Here I have foreach with data and button "Show more"  -->
</div>
</body>

@livewireScripts

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.pjax/2.0.1/jquery.pjax.min.js"></script>

<script>
    $(document).pjax("a",'#pjax-container');
</script>

</html>

我不知道哪里有问题。感谢您的帮助。

解决方法

尝试添加脚本 jquery：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

我终于找到了解决方案。

您必须在 pjax 结束后使用以下命令重新扫描所有 livewire 组件：

window.livewire.rescan()

ajax javascript laravel laravel laravel-livewire pjax

在 pjax 重新分配容器后，Laravel livewire click 未执行

问题描述

解决方法

相关问答