Question

我需要在函数和promise中使用props。怎么做？

let a = this.props.func // method
let b = this.props.func // method
function(){
   b // not method
   a // undefined
   this.props.func // undefined
}

Answer 1

lambda保持this引用您正在寻找的this，这样做

() => {
  this.props.func //is a method
}

此外，let仅适用于同一范围，通过执行您创建新范围的功能，将let更改为var s，方法保留在内部新的范围。

Answer 2

您当前的问题是您使用的是匿名功能。匿名函数不会从它上面的作用域继承this。它会自动将自己分配给window对象（如果使用节点，则为global）。在React组件中，它可能会返回undefined。

(function(){
  console.log(this === window || this === undefined) //true, in a React Component
})()

你有两个解决方案（但一个更好）

<强> 1。使用bind，这是一个丑陋的解决方案 bind将创建该函数的新副本，其中this被指定为您想要的任何内容。你可以bind到它上面的范围（这是你的React组件）。

(function(){
  console.log(this !== window && this !== undefined) //true, in a React Component
}).bind(this)() //`this` in `bind` is your React Component's `this`

<强> 2。使用箭头功能，更喜欢箭头函数没有自己的this。它从上面的范围接受this。这 not 在正常function中发生。

(() => {
  console.log(this !== window && this !== undefined) //true, in a React Component
})()

最终，这是您问题的直接答案：

() => {
   b 
   a
   this.props.func
}

我很惊讶this.props.func没有在原始示例中引发错误。也许你决定省略那一部分。

React.js：如何发送道具的链接？

2 个答案: