我想知道我们什么时候在我们的 react 的 jsx 中使用类似的东西
something = {this._onRefresh}
something = {() => this._onRefresh}
something = {this._onRefresh()}
something
可能是我们传递给我们的东西
- 子组件
onChange
事件onClick
事件- 您能想到的任何其他情况
我们的 ._onRefresh()
可能在哪里
._onRefresh = () => {
//changes state of our react component
//Call redux action
//call other functions
}
或者在表单的情况下,它接受触发它的事件
._onRefresh = (event) => {
//takes target value to search inside the data
//Store data in the backend
}
谁能解释一下我们什么时候需要使用哪一个?将帮助我清除 react 和 javascript 的基础知识
最佳答案
1/2 点和 3 点实际上是完全不同的。
您的第 3 点执行一个函数并将返回值分配给 something
。
您的示例 1/2 将函数分配给某物
情况 3 可以用于例如您具有 disable
属性,并且您想要分配函数的返回 true/false
的情况。
第 1 点和第 2 点是为属性分配一个函数,例如 onClick
属性,它接受点击时调用的回调。
第一点和第二点的区别在于,如果您将该代码放在 render
方法中,第二点会为每个渲染创建一个函数,这对于性能来说并不是最好的。
使用第一点,你应该注意如何在方法中定义引用this
的方法。
如果您将类方法定义为:
myMethod() {
console.log(this); // it will be undefined by default
}
然后如果你想在方法中访问this
,你需要在构造函数中绑定(bind)this
:
this.myMethod = this.myMethod.bind(this);
如果你将方法定义为箭头函数,它会在方法中保留 this
的值,所以不需要绑定(bind):
myMethod = () => {
console.log(this);
};
关于javascript - 在 jsx 中使用 () => vs this.something,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53834503/