一、场景描述
上一节,我们学习了,自定义事件绑定到组件上。
现在,我们学习下,给组件解绑自定义事件的几种方法。
首先,我们试想一下,这个功能的适用场景?
一般同学都会想,解绑?那就注释掉代码就是了呗。
这个办法也可以,但是,不好,因为每次都要修改代码。
现在,我们实现通过按钮,从页面上给事件解绑。
此时,我们就可以在后台管理系统上,对整个项目的组件进行事件管理。而无需更新代码。
二、解绑自定义事件
给Student
组件解绑
方式1(推荐)methods
函数:
unbind(){
this.$off('test') //解绑一个自定义事件
this.$off(['test','demo']) //解绑多个自定义事件
this.$off() //解绑所有的自定义事件
},
方式2
销毁vc
methods
函数:
death(){
//此处的this是Student组件的vc实例
this.$destroy() //销毁了当前Student组件的实例,销毁后所有Student实例的自定义事件全都不奏效。
}
方式3(禁用)
销毁vm
main.js
中:文章来源:https://www.toymoban.com/news/detail-802293.html
new Vue({
el:'#app',
render: h => h(App),
mounted() {
setTimeout(()=>{
this.$destroy() //此处的this是vm
},3000)
}
})
三、总结
解绑那个组件上的事件,就在该组件上编写解绑代码。文章来源地址https://www.toymoban.com/news/detail-802293.html
到了这里,关于Vue2:解绑自定义事件的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!