我正在使用Laravel Nova
自定义工具来创建我自己的模板。 Nova使用vuejs
所以我试图在Tool.vue
中添加我的自定义表单和js逻辑。
我运行这个非常简单的代码来执行select上的onChange()
事件,但是我得到以下错误:
Uncaught TypeError: Cannot read property 'apply' of undefined
at e (vendor.js?id=52886433f04b87b2c184:1)
at HTMLSelectElement.Yr.e._withTask.o._withTask (vendor.js?id=52886433f04b87b2c184:1)
这是我的表格:
<template>
<div>
<heading class="mb-6">Model Register Custom</heading>
<div>
<select v-model="selected" @change="onChange">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</div>
</div>
</template>
这里是我的js逻辑,而不是alert()产生错误:
<script>
let Vue = require('vue');
export default {
mounted() {
var vm = new Vue({
methods: {
onChange() {
alert("dsds");
}
}
})
},
}
</script>
P.S:用简单的javascript简单onChange工作正常,但是用vuejs
方法我总是得到这个奇怪的错误。
它的形状是错误的,你应该把它从安装中扔掉。作为生命周期,安装它已经是一个函数,所以如果你想在屏幕的程序集中调用它,你可以从组件中声明方法,并在挂载的内部调用它。但在你的情况下,在挂载时调用该函数是没有意义的,只有当你点击一个项目时才是。例。
<div id="app">
<heading class="mb-6">Model Register Custom</heading>
<div>
<select v-model="selected" @change="onChange">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</div>
</div>
new Vue({
el: '#app',
methods: {
onChange() {
alert("dsds");
}
}
})