gpt4 book ai didi

Laravel Mix 未定义 JavaScript 函数

转载 作者:行者123 更新时间:2023-12-01 15:04:39 25 4
gpt4 key购买 nike

首先,resources/js/app.js 中的代码

function button1Clicked(){
console.log('Button 1 is clicked');
}

二、testing.blade.php中的代码
<!DOCTYPE html>
<html>
<head>
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Testing</title>
</head>
<body>
<button onclick="button1Clicked()">Button 1</button>
<button onclick="button2Clicked()">Button 2</button>

<script type="text/javascript" src="{!! asset('js/app.js') !!}"></script>
<script type="text/javascript">
function button2Clicked(){
console.log('Button 2 is clicked');
}
</script>
</body>
</html>

之后 npm run dev并在 localhost 中进行测试

enter image description here

结果,JavaScript 函数 button1Clicked()resources/js/app.js没有定义。但函数 button2Clicked()testing.blade.php可以定义。
是 Laravel Mix 的错误还是我犯了一些错误

最佳答案

我和你有同样的问题。

事实证明,当 Laravel-mix(又名 Webpack)编译 js 时,它会将我们的函数包装在一个闭包中。

例如,当我们定义这样的函数时

function setlocale(code) {
console.log(code);
}

Webpack 会生成成
(function(module, exports, __webpack_require__) {

function setlocale(code) {
console.log(code);
}

});

这就是为什么我们可以访问该闭包内的变量或函数,但我们不能从外部访问,因为它限制了我们的范围。

一个简单的解决方案是将我们的函数设置为 window变量,它是一个全局变量。
window.setlocale = function (code) {
console.log(code);
}

关于Laravel Mix 未定义 JavaScript 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46643667/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com