[英]vm.handleClick is not a function on vue.js
我正在使用氩气模板的切换按钮: 氩气模板docs
而且我想在切换按钮上放置一个handleChange,但是它不起作用,这里是我的代码:
<template>
<div class="option">
<div>Show value
<label class="custom-toggle">
<input type="checkbox" @click="handleClick($event)">
<span class="custom-toggle-slider rounded-circle"></span>
</label>
<div v-if="viewCheck">
<div>Name </div>
<div>Surname</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Options',
data: function() {
return {
viewCheck:false
}
},
handleClick: function(event) {
console.log(event)
this.viewCheck = true
}
}
</script>
实际上,当我单击切换按钮时,会收到以下消息:
TypeError:_vm.handleClick不是函数
单击时(在./node_modules/vue-loader/lib/template-compiler/index.js上评估)?{“ id”:“ data-v-6f2958af”,“ hasScoped”:false,“ transformToRequire”:{“ video” :[“ src”,“海报”],“源”:“ src”,“ img”:“ src”,“图像”:“ xlink:href”},“ buble”:{“ transforms”:{}} }!./ node_modules / vue-loader / lib / selector.js?type = template&index = 0!./ src / views / Option.vue
(app.js:7731)、: 22:34)
在invokeWithErrorHandling(vue.esm.js?efeb:1863)
在HTMLInputElement.invoker(vue.esm.js?efeb:2188)
在HTMLInputElement.original._wrapper(vue.esm.js?efeb:7559)
您应该将其放入methods
属性中。
尝试这个:
export default {
name: 'Options',
data: function() {
return {
viewCheck:false
}
},
methods: {
handleClick: function(event) {
console.log(event)
this.viewCheck = true
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.