コンポーネント FrindListWidget
が 2 つの條件で呼び出される MERN プロジェクトを構(gòu)築しました。
user.friends
のステータスが更新されます。 各 Friend
には、Friend
も含まれています。
どうやら、Chrome デベロッパー ツールの [ネットワーク] タブを確認(rèn)するまでは、すべてが正常に動作していたようです。
friends
が無限回呼び出されていることがわかりました。明確にするために、console.log("friends",friends);
と書きました。はい、何度も録音されています。
次のコードを共有します:
FriendListWidget.jsx
リーリーFriend.jsx
リーリーuserRequest は単なる axios メソッドです:
リーリーuseEffect フックの依存関係を削除してみました:
リーリーただし、レンダリングは 1 回だけです。実行時に
を介した更新は表示されません。更新を確認(rèn)するにはウィンドウをリロードする必要があります。
useEffect に挿入したユーザーのリストを更新する getFriends() 関數(shù)を呼び出していると仮定します。したがって、useEffect 自體を無限に更新するため、useEffect を別の値に依存させるようにしてください。
リーリーこのケースでは、私は個人的にreact-queryを使用し、enabled屬性を使用してAPIを再度呼び出すタイミングを決定しますが、ロジックに重大な問題があり、理解できません。 CodeSandBox などのプラットフォームを使用して作成してください。問題の再現(xiàn)可能な最小限の例があれば、より適切にサポートできるようになります。