react组件间交互时处理this的三种方式

子组件input框触发onChange方法时,实际调用父组件上changeHandle方法,如直接在onChange方法中调用this.aaa,则this指向window。不能正确实现想要的效果。改变this有三种方法:

原例子

1、用箭头函数

子组件


父组件

在箭头函数(e)=>this.aaa(e)中调用。

2、在构造函数中用bind方法绑定

constructor(props){

    super(props);

    this.aaa=this.aaa.bind(this)

  }

onChange={this.aaa};

3、在onChange方法中用bind方法绑定

onChange={this.aaa.bind(this)};

亲测三种方法都可实现。

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

推荐阅读更多精彩内容

  • "use strict";function _classCallCheck(e,t){if(!(e instanc...
    久些阅读 2,062评论 0 2
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,945评论 2 17
  • 前言 最先接触编程的知识是在大学里面,大学里面学了一些基础的知识,c语言,java语言,单片机的汇编语言等;大学毕...
    oceanfive阅读 3,176评论 0 7
  • 文/肖筱兮 寒假里追的一部剧《我的青春遇见你》,今天终于看完了。 男主最后的一段话令我十分深刻:“我是陈也,大城市...
    肖筱兮阅读 592评论 2 10
  • 又是一年三月,又是阴雨连绵的三月。印象中的三月,有枇杷的酸甜、有相聚的喜悦、有祝福的心愿。不过,在现在,那只是印象...
    噫__阅读 333评论 0 1