React hooks
Functional Componentsでstateを使えるようにするもの
要するにフックとは?
フックとは、関数コンポーネントに state やライフサイクルといった React の機能を “接続する (hook into)” ための関数です。フックは React をクラスなしに使うための機能ですので、クラス内では機能しません。今すぐに既存のコンポーネントを書き換えることはお勧めしませんが、新しく書くコンポーネントで使いたければフックを利用し始めることができます。
新しく書くコードについては、基本はhooksで書いてあげるのが良いらしい
code:sample.tsx
import React, { useState } from 'react';
function Example() {
// Declare a new state variable, which we'll call "count"
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
useState()を使う
useState は現在の state の値と、それを更新するための関数とをペアにして返します
引数は、そのstateの初期値
慣例として、[stateName, setStateName]と言うペアで変数を作る模様