javascript - 在 setState 之后使用 setTimeout 来避免异步问题

Question

我经常这样做

this.setState({
something: this.state.something + 1
})

setTimeout(() => { this.props.somefunction(this.state.something) },100);

这甚至是正确的吗？但这至少解决了我的问题。如果我不在这里超时，在我的父组件中声明的 somefunction 将收到一个未定义的参数。我猜 this.props.somefunction() 是在 setState 完成之前执行的？

Answer 1

不，这不是一个好的模式。异步函数应该有一个你可以使用的回调参数，并查看 docs , 有一个。

将您的函数作为 setState 的第二个参数。

this.setState({...}, () => {
    this.props.somefunction(this.state.something);
}

这里使用 setTimeout 不好的原因是你在冒险。你是说，“我不知道这个异步操作需要多长时间，但我预计它不会超过 100 毫秒，所以我要碰碰运气。”但当然，您不知道需要多长时间。

callback 参数确保该函数将在异步操作完成后运行，因此您无需祈祷。