未捕获的TypeError:尝试在Vuejs中调用onchange()方法时,无法读取未定义的属性“apply”

问题描述 投票:0回答:1

我正在使用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方法我总是得到这个奇怪的错误。

javascript vue.js vuejs2 vue-component laravel-nova
1个回答
0
投票

它的形状是错误的,你应该把它从安装中扔掉。作为生命周期,安装它已经是一个函数,所以如果你想在屏幕的程序集中调用它,你可以从组件中声明方法,并在挂载的内部调用它。但在你的情况下,在挂载时调用该函数是没有意义的,只有当你点击一个项目时才是。例。

<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");
    }
}
})

https://jsfiddle.net/hamiltongabriel/ke8w9czy/4/

热门问题
推荐问题
最新问题