Class Components and State

7355 ワード

クラスコンポーネントと機能コンポーネントの違い
function componentはfunctionです何を返すのか.画面に表示されます.
Class ComponentはClassただし、React Componentから拡張され、画面に表示されます.
(renderメソッドに入れる必要があります.)

import React from "react";
import PropTypes from "prop-types";

class App extends React.Component {
  render() {
    return <h1>나는 클래스 컴포넌트야.</h1>;
  }
}

export default App;

リアクターは、すべてのクラスコンポーネントのレンダリング方法を自動的に実行します.

class App extends React.Component {
  state = {
    count: 0, //내가 바꿀 데이터를 state에 넣는다
  };
  render() {
    return <h1>The number is {this.state.count}.</h1>;
  }
}

stateには変更したいデータが含まれています.

class App extends React.Component {
  state = {
    count: 0, //내가 바꿀 데이터를 state에 넣는다
  };

  add = () => {
    console.log("add");
  };
  minus = () => {
    console.log("minus");
  };

  render() {
    return (
      <div>
        <h1>The number is {this.state.count}</h1>
        <button onClick={this.add}>Add</button>
        <button onClick={this.minus}>Minus</button>
      </div>
    );
  }
}

javascriptでは、他のonClickまたはイベントリスナーを登録する必要がありますが、応答には自動的に指定されたonClickがあります.

C#ストリーム書き込みクラスStreamWriterの基本紹介

line-height:18 pxが使用できない理由

Class Components and State

Reference