REACT useStateって何?
初心者がわかったつもりで先に進むと、また忘れていたので?
とりあえずメモしとくことにしました。
種田山頭火 が唄う 分け入っても分け入っても青い山の気持ち。
useStateはコンポーネントの中で値を保持したり更新したりする仕組みらしい
コンポーネントはUI 上で独立した再利用可能な部品のことで、関数コンポーネントとクラスコンポーネントがあるらしい。
関数コンポーネント
JSで記述された関数で、propsで値を引き継ぐコンポーネント。
関数コンポーネント内のreturn文でJS(JSX)などのReact要素を返却する。
クラスコンポーネント
React.Componentを拡張(extend)して作成されたコンポーネント。
クラスコンポーネント内のrenderメソッド内でjs(jsx)を返却する。
んん...
useStateは、関数コンポーネントでデーター保持更新する変数や関数を定義できる
関数コンポーネントでのuseStateの使い方。
その1 準備
useStateは、REACTのライブラリの中に定義されているので使う場合は、最初にimportする。
import React, { useState } from 'react';その2 定義
const [変数名, 更新関数名] = useState(変数の初期値);
const [count, setCount] = useState(0);その3参照更新
const func(引数) return JS JSX ;
const Func = (props) => { return <h1>Hey, {props.name}</h1>; };他のコンポーネントからも更新関数を使って変数を更新できる。
変数や引数が更新されたタイミングで、再レンダリング(再描画)される。
REACT公式サイト
理解がちがうこともあるので、公式サイトも見てください。