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

Strict モードで React コンポーネントを 2 回レンダリングする

Strict モードでは、React は潜在的な副作用を検出するためにコンポーネントのレンダリング関数を意図的に 2 回呼び出します。この動作は、コンポーネントを 2 回レンダリングすることで明らかになります。

提供されたコード例では、Update コンポーネントは厳密モードで実行されているため、2 回レンダリングされます。 Index.js の strict モード タグをコメント アウトすると、問題は解決し、コンポーネントは 1 回だけレンダリングされます。

React.StrictMode は、レンダリング フェーズでの偶発的な副作用を特定するのに役立つ開発モード機能です。これは、レンダリング関数を複製することによって実現されており、これにより、他の方法では気づかれない可能性がある問題が明らかになる可能性があります。

React のドキュメントによると、レンダリング中に予期しない副作用が次の原因で発生する可能性があります。

• コンポーネントのレンダリング関数
• の外でフックを呼び出している間、DOM から読み取ります。 render
• レンダリング中にコンポーネントに渡される ref にアクセスする
• レンダー関数内で状態を変更する
• コンポーネントのレンダー関数内から親コンポーネントの状態変更をトリガーする

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