有时我会在react handler上看到它:
<Results onClick={() => this.somefunction()}/>
和其他时间类似:
<Results onChange={this.handleChange} />
这些编写代码方式的邮件有何区别?
答案 0 :(得分:1)
先前的“提升” someFunction
在回调中,以便稍后运行。后者立即在handleChange
中查找代码。
此外,您还遇到this
的上下文问题。在箭头函数中,this
不会将上下文附加到函数本身,而是附加到父上下文。本质上,在每个示例中,this
都具有相同的上下文。
答案 1 :(得分:1)
在第一个示例中,somefunction
无需担心访问错误的this
:它将引用定义在其中的类的实例。
第二个示例 不一定完全相同,具体取决于定义方式:您将需要绑定该函数或使用箭头函数。
实际的反应文档提供了有关以下方面的更多见解:https://reactjs.org/docs/handling-events.html
也:引用身份。第一个示例在每个渲染器上创建一个新函数。它可能会与纯组件混在一起,因为道具会不断变化。第二个示例传递的功能始终相同:纯组件将它们视为与以前相同的道具,并且不会重新呈现不必要的内容。