Question

因此，在响应中，setState()是异步的，并且可以缓冲调用以更改状态。我明白了。如果您以某种方式依赖状态来计算新状态，那么如何使用setState((state) => {})这样的可选回调。

但是让我说我不想简单地更新状态，但只是确定它在某个时间点实际包含的内容？我们举个例子：

我有一个文本字段。当有人编辑该字段时，它会使用setState({ hasChanged: true })设置状态。很好。在onClick回调（其他地方）我想检查文本字段是否“已更改”并保存其文本内容，然后再继续。但问题是我永远无法确定state.hasChanged实际上是否与现实同步。与setState((state) => {})中的回调不同，我独自在这里。

那么我是否创建了一个“阴影状态”（或者，至少是一个与反应状态分离的状态变量）并保持更新仅适用于这种情况？看起来有点麻烦，我怀疑这不是你应该怎么做的，因此这个问题。

编辑澄清：我只想“检查”状态，并确保它的内容（因为我是我的情况，我将根据它进行保存到磁盘）。我实际上不会更新状态。如果是这种情况，带回调的setState可能是正确的选择..

Answer 1

这是一个相当理论上的问题，这很可能永远不会像你给出的例子那样成为一个问题。

无论如何，你可以将一个回调传递给setState作为第二个参数，一旦你的状态被改变就会调用它。

Answer 2

这就是为什么React有一个生命周期，你可以通过componentDidUpdate，value等方法进行监听（你可以查看完整列表here）。按照您的示例，当文本字段发生更改时，状态componentWillUpdate会更新，您可以在方法componentDidUpdate和class Main extends React.Component { constructor(props) { super(props); this.state = { value: '' }; this._handleOnChange = this._handleOnChange.bind(this); } componentWillUpdate(nextProps, nextState) { if(nextState.value !== this.state.value) { console.log('value will update'); } } componentDidUpdate(prevProps, prevState) { if(prevState.value !== this.state.value) { console.log('value did update', this.state.value); } } render() { return ( <form> <input type='text' autoFocus onChange={this._handleOnChange} ref='text'/> </form> ); } _handleOnChange() { this.setState({ value: this.refs.text.value }); } } ReactDOM.render(<Main />, document.getElementById("main"));中“截取”此更改，如下所示：

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

#include <stdio.h>

int n,t=1,nextTerm,sum=0,i;

int main() {
    printf("Enter an integer number:");
    scanf("%d",&n);
    for(i=1;i<=n;i++) {
        if (t%2 == 0) {
            nextTerm = 1;
        }
        else {
            nextTerm = -1;
        }
        t=nextTerm*(t*t);
        sum=sum+t;
    }
    printf("The value of the series is: %d\n",sum);
    return (0);
}

您可以在official docs中找到有关州和生命周期的更多信息。

Answer 3

我真的认为这是一个非常困难的案例。我们知道setState只需要几分之一秒才能执行，而在实际情况下，当单击按钮时，状态已经发生变化。

为了能够完全相信react做得很好，我可以想到一些想法：

您可以在this.state.hasChanged为false时禁用该按钮。因此，您应该始终等待下一个render检查hasChanged的状态并启用它。
在state lastAction内使用新密钥，componentDidUpdate帮助if (this.state.lastAction === "myLastAction")制定如下规则：

{{1}}

我如何信任React.js中的州

3 个答案: