プロジェクトcomponentWillReceivePropsはgetDerivedStateFromPropsに切り替え

　　時間の長い期間のために、ライフサイクル関数componentWillReceivePropsは応答小道具の変更後に更新するための唯一の方法です。

　　反応計画17.0はcomponentWIllMount、componentWillReceivePropsとcomponentWillUpdateを削除しました。それ以来、唯一の新しい「unsafe_という」ライフサイクル名は有効です。

　　物事のgetDerivedStateFromPropsも進行中であることcomponenetWillReceivePropsを置き換えるために、プロジェクトで使用されます。最初は、元のメソッドのコードを置きます：

クラスインデックスReact.Component {延び
  コンストラクタ（小道具）{ 
    スーパー（小道具）。
    この .state = { 
      USERLIST：[]、
      editInfo：{名： ""、PARENTID：ヌル、マネージャーID： ""、ID： "" } 
    }。
  } 

    componentWillReceiveProps（nextProps）{ 
    場合（この .props.editInfo.id ==！nextProps.editInfo.id）{
       この .props.form.setFieldsValue（{名：nextProps.editInfo.name、 'ユーザー' ：nextProps.editInfo。マネージャーID}）
    } 
  }   

}

　　公式アップデートのドキュメントは言う：「とcomponentDidUpdate一緒に、この新しいライフサイクル（getDerivedStateFromPropsは）昔のすべてのユースケースのcomponentWillReceivePropsをカバーする必要があります。」

　　getDerivedStateFromPropsは小道具の更新を得ることができますが、直接交換は、this.propsアクセスエラーが来ました。あなただけの状態を変更することができ、かつcomponenetDidUpdateは、変更前の状態を監視することができます。私はここで比較的多くだし、フォームのthis.propsでフォームを変更します。コードは以下の通りであります：

  静的getDerivedStateFromProps（小道具、状態）{ 
    IF（props.editInfo.id == state.editInfo.id！）{ 
      リターン{ 
        editInfo：props.editInfo 
      }。
    } 

    はnullを返します。
  } 

  componentDidUpdate（prevProps、prevState）{ 
    IF（this.state.editInfo.id == prevState.editInfo.id！）{ 
      this.props.form.setFieldsValue（{ 
        名：this.state.editInfo.name、
        ユーザー：本。 state.editInfo.managerId 
      }）。
    } 
  }

　　しかし！古いcomponentWillReceivePropsまたは新しいgetDerivedStateFromPropsは通常、予期しないバグの数につながる、部品の複雑さが増加しています。

　　https://zh-hans.reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html

　　この文書では、より多くのあなたが参照することができ、両方のライフサイクルアプローチを考えています。

プロジェクトcomponentWillReceivePropsはgetDerivedStateFromPropsに切り替え

おすすめ