はじめてのReact

2019-05-21

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 要素が操り人形って感じだな。