Question

我经常这样做

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

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

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

Answer 1

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

使您的函数成为.setMaster('local')的第二个参数。

setState

在这里使用this.setState({...}, () => { this.props.somefunction(this.state.something); }的原因很糟糕，是因为你有机会。你说，“我不知道这种异步操作需要多长时间，但我不希望它花费的时间超过100毫秒，所以我要抓住机会。”但是，当然，你不知道需要多长时间。

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

Answer 2

official documentation建议您放置＆＃34;回调逻辑＆＃34;在<input type="text" class="form-control" name="first_name" id="first_name" placeholder="Sólo letras" value="<?php if ( $_POST ) { echo $_POST[ 'first_name' ]; } else { echo $_SESSION[ 'first_name' ]; } ?>" required> ...内，而不是componentDidUpdate()的秒参数。

setState（）的第二个参数是可选的回调函数这将在setState完成且组件完成后执行重新呈现。通常我们建议使用componentDidUpdate（）这样的逻辑。

以下是如何执行此操作的示例：

setState()

Answer 3

使用setTimeout在动作完成时运行动作通常是不好的做法，facebook的开发人员肯定会考虑到这一点。这就是为什么他们有一个回调方法作为setState的第二个参数。

setState({ something: newState }, () => {
   // Run dependant actions here
})

在setState中使用setTimeout进行响应以避免异步问题

3 个答案: