k-tokitoh

2019-05-21

はじめてのReact

react ってなんだ。

• ReactDOM.render(追加するDOM要素, 追加する場所)
• JavaScript のオブジェクト
• コンポーネントの引数を props と呼ぶ。
• コンポーネントを関数として記述する場合は以下。

function Hoge() {
  return <div>hoge</div>;
}

• コンポーネントをクラスとして記述する場合は以下。

class Hoge extends React.Component {
  render() {
    return <div>hoge</div>;
  }
}

• コンポーネントをクラスとして記述することにより、ステートという仕組みを利用することができる。
• state とは「UI の書き換えに必要となる Component の状態を保持するためのデータ」
• 具体的には、アトリビュートとして state というのをつくって、そこにオブジェクトを持たせる。
• developer tools では、コンポーネントが render した DOM 要素しか見ることができない。
• react developer tools なら、コンポーネントの props や state）も見ることができる。
• なんかあれだな、コンポーネントが黒子で DOM 要素が操り人形って感じだな。