React コンポーネントが Strict モードで 2 回レンダリングされるのはなぜですか?

React コンポーネントが 2 回レンダリングされるのはなぜですか?

質問:

React コンポーネントは一見正しく機能しているように見えますが、レンダリングが 2 回行われます。最初に電話番号とゼロ ポイントが表示され、その後、必要なすべてのデータを含む 2 番目のレンダリングが表示されます。この問題の原因は何ですか?

回答:

この動作は、アプリケーションを厳密モードで実行していることが原因である可能性があります。

厳密モードはオプションのフラグです。 React では、レンダリング段階での潜在的な副作用を特定するのに役立ちます。有効にすると、render メソッドなどの特定の関数を意図的に 2 回呼び出して、意図しない結果を強調表示します。

この場合、予期しない再レンダリングは、React.StrictMode の呼び出しを 2 倍にすることによって引き起こされます。レンダリング関数。この問題を解決するには、index.js の strict モード タグをコメント アウトして開発中に無効にします。

追加情報:

React.StrictMode は副作用の検出に役立ちます。 DOM との対話や状態の更新など、レンダリング段階で。意図的に関数を 2 回呼び出すことで、見落とされる可能性のある予期せぬ動作が強調表示されます。

React.StrictMode の公式ドキュメントには、厳密モードでの再レンダリングの潜在的な原因に関する詳細情報が記載されています。

https://reactjs.org/docs/strict-mode.html#detecting-unexpected-side-Effects

以上がReact コンポーネントが Strict モードで 2 回レンダリングされるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。