検索

ホームページ  >  に質問  >  本文

useEffect が完了する前に実行する関数

このコードがあります:

リーリー

問題は、let chatProps = useMultiChatLogic('xxxx-xx-x-xx-xxx', username, Secret);useEffect が完了する前に実行されることです。 .then内に移動しようとしましたが、フックエラーやその他のものが発生しましたが、何も機能しませんでした。

P粉916760429P粉916760429262日前509

全員に返信(1)返信します

  • P粉983021177

    P粉9830211772024-04-02 00:44:59

    React の基本的な理解が欠けていると思います。状態、useEffect、および一般的な制御フローに関するチュートリアルを確認してください。

    useEffect は非同期です - React は最初のレンダリング後、依存関係配列にキャプチャされた変数が設定されるたびにコールバックを実行します。依存関係の配列は空であるため、この useEffect はコンポーネントのライフサイクル中 (最初のレンダリング後) に 1 回実行されます。

    Multi が何なのかはわかりませんが、次のようなものを試してみてください:

    リーリー

    ここで、最初のレンダリングでは、usernamesecret がまだデフォルトの空文字列であるため、リクエストがまだ完了していないことがわかり、読み込みメッセージをレンダリングします。レンダリング後、useEffect が実行され、リクエストが開始されます。

    しばらくすると、応答が到着し、usernamesecret の状態を設定し、別のレンダリングをトリガーします。このレンダリングでは、usernamesecret の値が応答で利用可能です (応答では空でない文字列であることが保証されていると思います)。そのため、読み込みメッセージは次のようになります。レンダリングされません。代わりに、応答データを含む小道具を受け入れる ChatsPage コンポーネントをレンダリングします。

    useMultiChatLogic のようなフックは条件 < /a> の上で宣言する必要があるため、追加のコンポーネントが必要です。これがフックでない場合、呼び出しが発生する可能性があります 必要ありませんif の後のコンポーネント関数本体の追加コンポーネント用。


    React の黄金律は、状態は不変であるということです。そのため、あるレンダリングから次のレンダリングにデータが変更される場合は、 = ではなく setState を介して変更する必要があります。

    返事
    0
  • キャンセル返事