javascript - Promise.all() および setState() 反応ネイティブ

Question

コンポーネントで、fetch API を使用してデータベースからデータを取得したいと考えています。すべてのデータが取得されたら、Promise.all() を使用してコンポーネントの状態を変更したいと思います。

await Promise.all(data).then(
  this.setState({
    isLoading: false
  })
)

私の問題は、約束が解決される前に setState() が起動することです。ただし、このコードは機能しますが、isLoading はブール値ではなく配列です。

this.setState({
  isLoading: await Promise.all(data)
})

誰かが理由を知っていますか？私は React-Native を初めて使用するので、何か意見をいただければ幸いです。

score 3 · Accepted Answer

async/を使用しているawaitため、まったく呼び出すべきではありませんthen。それでも使用したい場合は、コールバックを渡す必要があります。ただし、コードは実際には次のようになります。

await Promise.all(data);
this.setState({
  isLoading: false
});

score 2 · Accepted Answer

次のように変更する必要があります。

await Promise.all(data).then((result) => {
   this.setState({
     isLoading: false
   })
 }
)

基本的にはパラメーターとして関数を持っているので、矢印関数の中.thenに入れなければなりません。setState

score 0 · Accepted Answer

then(
  this.setState(...)
)

setState() すぐに呼び出して、その結果をthen()(他の関数呼び出しと同様に)に渡します。

then()その呼び出しに関数またはラムダを渡す必要がありますsetState。

3 に答える 3