removeEventListenerz不生效的问题

1、

element.addEventListener(type,handler,false)
element.removeEventListener(type,handler,false)

handle函数要保持一致,才能移除指定的事件函数

 

2、

element.addEventListener(type,this.handler.bind(this),false)
element.removeEventListener(type,this.handler.bind(this),false)

类中绑定上下文的方法行不通,因为bind返回的是一个新的不同的函数

正确方式可以为:

'use strict'
 class Mouser {
 constructor (){
 this.counter = 0 
 this.clicked = function(event){
 this.counter ++ 
 console.log('clicks:',this.counter )
 if(this.counter> = 10)this.remove()
} 
 //保存点击处理程序,以便可以在多个地方使用
 this.clickHandler = this.clicked.bind(this); 
 window.addEventListener('click',this.clickHandler)
} 
 
 remove(){
 console.log('Removing click listener')// this 
 window.removeEventListener('click',this.clickHandler)
} 
} 
 
 var mouse = new Mouser()

 

发布了1 篇原创文章 · 获赞 2 · 访问量 1745
展开阅读全文

vue 销毁scroll事件 不生效

10-07

1.描述 在一个三级路由的页面里添加原生的scroll事件,百度的好多都是在destory事件里销毁,但是不生效,在别的页面scroll事件也是生效的,所以在另外两个生命周期里也加了事件销毁,但是没用。有知道的大佬可以告知下吗 ``` deactivated(){ window.removeEventListener("scroll",this.handleScroll,true); console.log('现在销毁scroll事件 在deactivaed') }, beforeDestroy(){ window.removeEventListener("scroll",this.handleScroll,true); console.log('现在销毁scroll事件') }, destroyed(){ window.removeEventListener("scroll",this.handleScroll,true); console.log('现在销毁scroll事件 在destroyed里面') }, ``` ``` mounted(){ window.addEventListener('scroll',utils._throttle(this.handleScroll),300) //节流+添加scroll事件 }, ``` 2、这是路由的一部分(scroll事件是在skills页面添加的,但是到了infos或者别的页面 依然存在) ``` {path:'oindex',name:'oindex',component:(resolve)=>require(['@/components/official/oindex'],resolve), children:[ {path:'infos',name:'infos',component:(resolve)=>require(['@/components/official/infos'],resolve)}, {path:'skills',name:'skills',component:(resolve)=>require(['@/components/official/skills'],resolve)}, {path:'wenyang',name:'wenyang',component:(resolve)=>require(['@/components/official/wenyang'],resolve)}, {path:'theory',name:'theory',component:(resolve)=>require(['@/components/official/theory'],resolve)}, ``` 问答

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览