非同期機能後にコンポーネントを強制的に更新しますか？

Question

私は私の中に次のコードを持っているが、コンポーネントの反応：

だから、

onSubmit(e) { 
     e.preventDefault(); 
     this.props.doSomething(); 

     this.setState({ 
      inputField: this.props.myReducer.someValue 
     }); 
    } 

、毎回誰かが「送信」ボタンを押すと、いくつかの機能が実行され、その後、私の入力フィールドの状態が応じた値で更新されますそれは「myReducer」で変更されました。

ただし、問題があります。 'doFunction'は非同期アクションです。つまり、直後に設定されたときに状態がまだ変更されていないため、後で状態をまっすぐに設定すると更新されません。

react/reduxでこれをどうすれば処理できますか？

Answer 1

これは、doSomething()の性質と関係しています。あなたはいつもその機能が完了したという通知を受けるべきです。

this.props.doSomething() 
    .then(() => 
      this.setState({ 
      inputField: this.props.myReducer.someValue 
      }); 

doSomething()は約束を返さない場合、それは返さないので、あなたはおそらくそれを編集したり、それを補強する必要があります時間の99％が、何かはほとんどのライブラリで、約束を返すAjax呼び出し、あります約束する。コールバックが必要な場合は、次のようにしてください：

new Promise(this.props.doSomething) 
    .then(() => 
      this.setState({ 
      inputField: this.props.myReducer.someValue 
      });