我试图在我的React应用程序中理解以下语法。本质上,我想了解setState()中的代码

this.getSomePromise().then(
      // resolve callback function
      someImg =>
        this.setState(prevState => ({
          ...prevState,
          doggo: someImg.message
        })),
      // reject callback function
      () => alert("Rejected!")
    );


我期待的是这样的语法;

    this.setState(prevState => {
// some code
    })


但是prevState =>之后的圆括号让我感到困惑。

最佳答案

ES6箭头使用隐式返回语法,该语法允许跳过return关键字。这是隐式返回的对象:

this.setState(prevState => ({
  ...prevState,
  doggo: someImg.message
}))


这是显式返回的快捷方式:

this.setState(prevState => {
 return {
  ...prevState,
  doggo: someImg.message
 }
})


这是作为新状态返回的对象文字:

{
  ...prevState,
  doggo: someImg.message
}


不使用(...)括号将其引起的包装将导致语法错误,因为对象文字中的{...}大括号将被解析为功能括号。

关于javascript - ReactJS和setState语法,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/54614628/

10-09 22:43