React が 3 つの状態にあるときにトリガーされる対応するフック

01. 初期化ステータス。

このフェーズは render() 関数によってトリガーされます。

1.コンストラクター();

2.componentWillMount();

バージョン 17 以降は UNSAFE_componentWillMount() に変更されました

理由: React はコンポーネントの非同期レンダリングを準備します。

3.render();

4.componentDidMount();

このフックは一般的に使用されます。通常、このコンポーネントで初期化を行い、開始タイマーを使用してネットワーク要求を開始します。メッセージを読んでください。(vueを学習している場合は、created()フックとmounted()フックを比較できます)

02. アップデートステージ;

内部コンポーネント setState() または親コンポーネントの render によってトリガーされます。

1. shouldComponentUpdate();

2.componentWillUpdate();

バージョン 17 以降は UNSAFE_componentWillUpdate() に変更します。

理由: React はコンポーネントの非同期レンダリングを準備します。

3.render();

これはレンダリングに最も一般的に使用されるフックです。

4.componentDidUpdate();

5.componentWillReceiveProps();

バージョン 17 以降は UNSAFE_componentWillReceiveProps() に変更されました。

理由: React はコンポーネントの非同期レンダリングを準備します。

03.荷降ろし段階。

ReactDom.unmountComponentAtNode(); によってトリガーされます。

1.ComponentWillUnmount()        

このフックも一般的に使用されます。通常、このコンポーネントでいくつかの仕上げ処理を行い、開始タイマーを使用してネットワーク要求を開始します。メッセージを読んでください。(vue を学習している場合は、Destroy() と destroy() の前の 2 つのフックを確認できます)

おすすめ

転載: blog.csdn.net/2201_75705263/article/details/132252778