laravel 中的 Javascript 函数未定义

Posted 2023-03-14

【中文标题】laravel 中的 Javascript 函数未定义

【英文标题】：Javascript function in laravel not defined

【发布时间】：2018-01-08 17:12:27

【问题描述】：

我在 app.js 中添加了一个 js 方法：

require('./bootstrap');

window.Vue = require('vue');

Vue.component('example', require('./components/Example.vue'));

const app = new Vue(
    el: '#app'
);

function hello()

    alert("hello");

然后编译我的资产并将 app.js 添加到我的视图中：

<script src=" asset('js/app.js') "></script>

如果我此时加载我的视图并查看源代码，我可以看到 app.js 的链接，如果我打开该 app.js，我可以在其中看到我的 hello 方法以及许多其他内容。

现在当我想调用我的方法时，我会尝试这样做：

<a onclick="hello();">

但在我的控制台中，我得到一个 Uncaught ReferenceError: hello is not defined 错误。可能是什么问题？

【参考方案1】：

Laravel mix 倾向于将所有 js 资产编译成一个不错的 webpack 时代，但这意味着你的函数实际上并不在全局范围内，因为它们都包裹在 immediately invoked function expressions (iife) 中。

你需要：

window.hello = function () 
     alert("Hello");

但是这通常不是最好的策略，理想情况下你应该在你的 vue 中添加一个事件处理程序。