project

2番目のプロジェクトの開始時には、2つの関数型構成部品クラス構成部品のうちの1つを使用する必要があります.
今回は関数型素子を学ぶ良い機会だと思います.
今回のプロジェクトは関数形式で行うことにした.

クラスvs関数

2019年から反フックを支援.
公式ファイルでは、関数型コンポーネントとフックを一緒に使用することを推奨します.
もちろん、両方とも熟知し、必要に応じて使用しなければならないので、深く研究しなければなりません.

クラス関数の違い

関数構成部品

import React from "react";

function App() {
  const name = "김영재";
  return <div>{name}</div>;
}

export default App;

クラス構成部品

import React, { Component } from "react";

class App extends Component {
  render() {
    const name = "김영재";
    return <div>{name}</div>;
  }
}

export default App;

クラスと関数型要素の役割は同じです.
違いは、クラスでstate、lifeCycleなどの機能を使用するには、renderという関数が必要です.
次に、表示する必要があるjsxを返します.
逆に,関数型素子の利点はクラス素子よりも宣言しやすいことである.
また、メモリリソースの消費量が少ないという利点もあります.
欠点は、stateとlifeCycleを関数型素子で使用できないことです.
反フックを導入したことで解決された.