关于 REACT 的一些笔记

项目地址


part_1: eventListener

window.addEventListener
window.removeEventListener
使得绑定和解绑的是同一个"处理函数(landMore)"

错误写法 1:

    window.addEventListener('scroll',this.landMore,false)
    window.removeEventListener('scroll',this.landMore,false)

问题:

    landMore 内部 this指向出错

现象:

    this.state.XXX = undefined

错误写法 2:

window.addEventListener('scroll',this.landMore.bind(this),false)
window.removeEventListener('scroll',this.landMore.bind(this),false)

问题:

解决了 landMore 内部 this 的指向问题 
但是 使用 foo.bind() 会返回一个新函数 
    add => landMore.bind(this) 
    rm  => landMore.bind(this)
导致 绑定的 landMore 和取绑的 landMore 是两个不同的函数

现象:

    跳转页面后还是会执行 landMore 函数

正确写法:

constructor(){
    super()
    this.landMore = this.landMore.bind(this)
}

实现:

1:指定this
2:add/rm 同一个函数
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • DOM DOM内容主要分为四部分: 什么是DOM和节点; 获取节点; 节点操作(3种); 属性操作(3种)。 什么...
    magic_pill阅读 795评论 0 1
  • 以下文章为转载,对理解JavaScript中的事件处理机制很有帮助,浅显易懂,特分享于此。 什么是事件? 事件(E...
    jxyjxy阅读 3,076评论 1 10
  • 事件绑定的方式 给 DOM 元素绑定事件分为两大类:在 html 中直接绑定 和 在 JavaScript 中绑定...
    Bruce_zhuan阅读 1,061评论 0 6
  • 什么是事件: 我们可以简单的把事件理解为浏览器的感知系统。比如说:他可以感觉到用户是否点击(click)了页面、鼠...
    张松1366阅读 6,839评论 1 6
  • 马上就要春节放假了,周围的同事也陆续回家了。年底2,3天打酱油的时间里,突然很想谈谈自己对15年互联网的感受。...
    原来是桃子阅读 182评论 0 3