javascript - 使用 prevState setState 失败

Question

下面我的 react 方法有什么问题

toggleReply = () => {
        this.setState(prevState => ({ reply: !prevState.reply }))
    }

我知道我可以this.setState({reply: !this.state.reply})但是上面的代码也可以工作，但它没有，有任何线索吗？

Answer 1

您的 setState 有效，按照docs - 尝试下面的这个片段。这是假设您的 Component 类已正确定义，并且您的toggleReply 处理程序在构造期间绑定(bind)到 this，或者您使用箭头函数来调用它。

class Thing extends React.Component {
    constructor(props) {
        super(props);
        this.state = { reply: false };
        this.toggleReply = this.toggleReply.bind(this);
    }

    toggleReply() {
        this.setState(prevState => ({ reply: !prevState.reply }))
    }

    render() {
        return (
            <div>
                <button onClick={this.toggleReply}>Toggle Reply</button>
                <span>{` ${this.state.reply}`}</span>
            </div>
        );
    }
}

ReactDOM.render(
    <Thing />,
    document.getElementById('root')
);

<script src=" https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.min.js"></script>
<div id="root"></div>