方法中的this问题
来源：3-2 React 中的响应式设计思想和事件绑定
自驱动
2020-05-05
- Q1 为啥会console两遍？
render(){
return (
<input type="text" onChange={console.log(this)}/>
)
}
- Q2 由Q1知，当input监听到值改变时，onChange调用者是TodoList，为啥inputChange()里面的this是undefined.
inputChange(){
console.log(this) // this=> undefined
}
render(){
return (
<input type="text" onChange={this.inputChange}/> // this=> TodoList
)
}
写回答
1回答
-
天河卢姥爷
2020-05-06
第一个问题我的理解是这样的，rander会在刚开始渲染的时候调用一次，第二次是不是你往输入框里面输入了美容，改变了它的Store的值，然后它才又渲染了第二次。
第二个问题的话，在class的构造函数里面的this都会指向实例对象，所以你往onChange里面的this打出来的都是实例对象TodoList，然后你往里面调用inputChange的时候，是把它当成是一个普通函数给调用进去了，而没有关联上下文，它不是class下面的原型函数。
然后class默认的情况下，是使用了严格模式，严格模式下普通函数的this是指向undefinded的（普通模式指向window），所以你最后它打印出来的是undefinded。
我是这样理解的，如何有错误的话，请指正。
20
相似问题