当前位置:  开发笔记 > 编程语言 > 正文

React setState +'prevState'来自哪里?

如何解决《ReactsetState+'prevState'来自哪里?》经验,为你挑选了1个好方法。

我刚开始学习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
        }));
    }

在这里困扰我的2件事:

    prevState争论来自哪里?在调用之前
    我没有看到任何类似的东西var prevState = this.state;,但仍然有效.

    箭头函数的语法:为什么箭头后的括号?
    为什么通常的arg => { statement; }语法不能在这里工作?

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



1> KA01..:

    prevState由React提供props,两者都是可选的.

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

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


答案2.不解释我的情况.如果我使用this.setState((prevState)=>({counter:prevState.counter + 1})); 它在一条线上都有效.但是a)没有花括号,它会出错.和b)没有标准括号没有错误,但根本没有增加.所以对我来说,我需要箭头语法的RHS上的两个括号,如this.setState((prevState)=>({key:value}));
推荐阅读
牛尾巴2010
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有