1.事件绑定和解绑
通常,我们会在mounted中给dom绑定事件,然后在beforeDestroy中解绑。不过,有的时候,绑定和解绑写在两个不同的函数里面会觉得有些麻烦,也不利于维护。其实,可以通过$once+hook将事件绑定和解绑写在一起。
原写法:
public mounted() {
this.targetRef.addEventListener("click", this.add, false);
}
public beforeDestroy() {
this.targetRef.removeEventListener("click", this.add);
}
新写法
public mounted() {
this.initEvent();
}
private initEvent() {
this.targetRef.addEventListener("click", this.add, false);
this.$once("hook:beforeDestroy", () => {
this.targetRef.removeEventListener("click", this.add);
});
}
这样,同一个功能就内聚了。
类似的,清除定时器也可以这么写。
2.父组件传递事件监听和属性
在开发中,曾有一些这样的需求。我们要对某个组件做一个包装,比如给按钮包装一个指令,在不需要修改逻辑的情况下快速实现一些额外的功能。
那么,原组