javascript - Laravel/Livewire 在 laravel 混合编译 app.js 中不起作用

标签 javascript event-handling addeventlistener laravel-livewire

我将 Laravel 与 Livewire 结合使用。我想对 js 中的事件使用react。一旦发出,就会出现一个 js 警报。 问题似乎出在 app.js 中,我有我的 js 函数。我收到一条错误消息,Livewire 不可用。我使用 Laravel Mix 编译它,它编译一切正常。

Error: Uncaught TypeError: Livewire.on is not a function

应用程序.js:

import Livewire from '../../vendor/livewire/livewire/dist/livewire'; 
Livewire.on('testEvent', function () {
  alert("test");
});

看起来像是导入问题。我已经删除了包并再次尝试,我也认为它是一个时间问题,所以我在文档加载时执行但仍然是同样的问题。 然后我决定通过组件 Blade 文件将它直接推送到堆栈,在这里一切正常。

@push('scripts')
<script>
   Livewire.on('testEvent', function () {
   alert("test");
   });
</script>
@endpush

应该不需要将它插入堆栈,因为我已经看到没有它的其他代码片段并且错误似乎是一个简单的导入问题?

最佳答案

使用浏览器检查器查看页面中是否加载了@livewireStyles 和@livewireScripts。确保已安装 Livewire

关于javascript - Laravel/Livewire 在 laravel 混合编译 app.js 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66679130/

相关文章:

javascript - 如何在HTML加载完成之前调用JS函数?

c# - 如何检查分配或未分配的事件处理程序

internet-explorer - Firebreath:窗口插件中一个 firebreath 事件的多个事件监听器

jquery,添加和删除事件处理程序

javascript - 在选定的搜索中禁用某些选项

JavaScript 从 textarea 中删除重复行,但保留(忽略)空行

javascript - Angular8 单选按钮检查功能意外运行

delphi - 如何向 TCustomControl 添加 OnClick 事件?

Javascript - 在 Firefox 中使用焦点不会调用最大化和选项卡切换事件

javascript - 为什么 bind(object) 不将 this 绑定(bind)到匿名函数中的对象?