反応素子のライフサイクル

2372 ワード

テキストリンク

<ジェネリック構成部品>
render()が動作すると、反応器.jsxファイルをDOMに貼り付けます.
DOMに貼り付けると、特定の動作を実行するように設定できます.

コンポーネントDidMount:最初のレンダリングに成功した場合、コンポーネントDidMountはその後実行されます.後で再レンダリングする場合は、この操作は実行されません.

componentDidMount() {
  // 첫 render가 잘 되었을때, 무엇을 할 지 여기에 작성하면 된다.
}

コンポーネントDidUpdate:再レンダリング後に実行されます.

componentDidUpdate() {
  // 다시 렌더링 될 때마다, 무엇을 할 지 여기에 작성하면 된다.
}

コンポーネントWillUnmount:コンポーネントを削除する前に実行します.非同期リクエストクリーンアップ(clearIntervalなど)もここで行います.

componentWillUnmount() {
  // 컴포넌트가 제거되기 직전, 무엇을 할 지 여기에 작성하면 된다.
}

コンストラクション関数の実行(ステータスやメソッドなど)->初回レンダリング()->ref->コンポーネントDidMount()

setStateまたはprops値を途中で変更した場合、shouldComponentUpdate->render()->componentDidUpdate()

構成部品が失われた場合、構成部品WillUnmount()->構成部品が失われます

<関数素子hooks>

useEffect(() => {

}, [])

この問題について(反応素子のライフサイクル), 我々は、より多くの情報をここで見つけました https://velog.io/@lyj-ooz/리액트-컴포넌트의-lifecycle

テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。

Collection and Share based on the CC Protocol