React setState +'prevState'来自哪里?

38 javascript reactjs

我刚开始学习React和JavaScript.
在完成本教程的过程中,我得到了一个组件的示例代码,它创建了一个切换按钮.
这是代码的一部分:

class Toggle extends React.Component {
    constructor(props) {
        super(props);
        this.state = {isToggleOn: true};
        this.handleClick = this.handleClick.bind(this);
    }

    handleClick() {
        this.setState(prevState => ({    // prevState?
            isToggleOn: !prevState.isToggleOn
        }));
    }
Run Code Online (Sandbox Code Playgroud)

在这里困扰我的2件事:

  1. prevState争论来自哪里?在调用之前
    我没有看到任何类似的东西var prevState = this.state;,但仍然有效.
  2. 箭头函数的语法:为什么箭头后的括号?
    为什么通常的arg => { statement; }语法不能在这里工作?

对不起,新手问题......

KA0*_*A01 36

  1. prevStateReact提供props,两者都是可选的.

  2. 括号允许多行,如果你不使用括号,你将被迫使用a prevState.您可以使用单行,但不需要花括号.

    • 更新:我忘了提到需要括号的特定情况.如果要返回没有updater语句的对象,则必须将其包装在括号中.谢谢@joedotnot抓住这个.因此它state会抛出一个错误,因为它看起来像一个函数而且props是一个无效的行.要解决这个问题,必须看起来像return

  • 答案2.不解释我的情况.如果我使用this.setState((prevState)=>({counter:prevState.counter + 1})); 它在一条线上都有效.但是a)没有花括号,它会出错.和b)没有标准括号没有错误,但根本没有增加.所以对我来说,我需要箭头语法的RHS上的两个括号,如this.setState((prevState)=>({key:value})); (4认同)