JavaScript - React でのデータのリクエストに fetch を使用することに関する質問

Question

今日、fetch を使用して反応プロジェクトのインターフェース データを改善したときに、難しい問題に遭遇しました。
ビジネス ロジックは次のとおりです。まずユーザーの ID を特定し、次にそのユーザーに対応するインターフェイスを表示します。
ただし、fetch はデータを非同期で取得し、結果が表示されます。最初にページがレンダリングされ、次にデータが要求され (データ要求はページのレンダリングよりも遅い)、その後、ページの表示ステータスが変更されます。州。
このように表示されます。ページには最初にインターフェイスが表示され、1 ～ 2 秒後にステータスが変化し、インターフェイスが再び変わります。ユーザー エクスペリエンスは非常に悪いです。解決策はありますか?
最初にデータを受け入れ、次に判断を完了してからインターフェイスをレンダリングするのが最善です。

Answer 1

これは実際には非常に簡単です。render の戻り値で三項演算子を実行します。データが取得されたかどうかを確認します。

リーリー

もう 1 つのアイデアは、レンダリングでフェッチを記述し、フェッチのコールバックに戻りテンプレートを配置して、データを取得してレンダリングできるようにすることです。まだテストしていませんが、できるはずです。
私の回答で問題が解決したと思われる場合は、クリックしてください
采纳答案
ご質問がある場合は、コメント欄で質問してください。

Answer 2

読み込みプロンプトボックスを表示します。
データリクエストが完了するまで待ってからページをレンダリングします

Answer 3

まずユーザーの ID ステータスを localStorage に保存し、初めて localStorage から取得します