💡ライフサイクルは?ライフサイクル

人のライフサイクルは乳幼児～老年期を指す.

反応については,画面上の出現,レンダリング,消失をライフサイクルと見なすことができる.

ライフサイクルを制御するとは
ライフサイクルの制御=構成部品を使用して、誕生、変化、および死亡の瞬間にタスクを実行します.


応答素子のライフサイクルを制御する方法は、クラス素子にのみ使用できます.

Mount=コンポーネントDidMountメソッド

更新=コンポーネントDidUpdateメソッド

Ummount=ComponentWillUmmountメソッド

💡クラス構成部品とは?

React構成部品を宣言する2つの方法の1つ(クラス/関数)

クラスの要素を頻繁に使用しない場合は、以前の項目、関数要素+Hooksを維持できない2つの操作があることを知るには、

が望ましい.

classとrender()メソッドが必要です.

import React, {Component} from 'react';

class App extends Component {
  render() {
    const name = 'react';
    return <div className="react">{name}</div>
  }
}

export default App;

💡関数構成部品とは?

React構成部品を宣言する2つの方法の1つ(クラス/関数)

12019年から使用され、等級型の欠点を補った.

import React from 'react';
import './App.css';

function App() {
  const name = 'react';
  return <div className = "react">{name}</div>
}

export default App;

💡React Hooksとは?

「

use」キーワードを前にして、元のクラスエレメントが関数型エレメントから取得(フック)する基本機能

を持つようにします.

、すなわち、関数型素子からクラス素子機能を取得する

である.

3種類の使用規則

応答関数コンポーネントでのみ呼び出されます.

コンポーネントの最上位レベルでのみ呼び出されます.

は条件を満たしていません.

Hooks allow function components to have access to state and other React features. Because of this, class components are generally no longer needed.

これまで日記帳の素子は,矢印関数を用いて関数型素子を作成してきた.
根本的には、関数型素子はライフサイクルを制御する方法(方法)もstate機能も持たない.state機能はクラス素子にのみ適用されるからだ.
私たちはずっとuserStateというreact Hooksを使ってstateを使っています.

useEffect=React素子のライフサイクルを制御する方法(方法)を取得し、これを後でまとめる.

React Hooksと関数構成部品を使用する理由

🚀参考資料

LifeCycle Method
React-lifecycle-methods-diagram
クラス構成部品
クラス差異と関数差異
W3C_react_hooks
反応講義-李正煥講義