Vuejs 移除事件绑定问题

Question

mounted(){

var change=()=>{
    //do something
}
this.$store.state.audioDom.removeEventListener('durationchange',change);
this.$store.state.audioDom.addEventListener('durationchange',change);
//audioDom是audio标签元素，audio标签在同级组件中。

}

为什么解绑事件无效？每次mounted完就添加一个事件。 如何避免重复绑定事件？

Answer 1

把绑定事件写到一个方法里面

比如：

bindEvent(){
this.$store.state.audioDom.addEventListener('durationchange',change);
//加一个绑定状态
this.isBinded = true;
}

然后在mounted里面判断isBinded这个值就行了

mounted(){
if(!this.isBinded){
    this.bindEvent()
}
}