ReactにおけるuseStateについて

概要

useStateとは、値を描画コンポーネント内で保持したいときに使うことのできるフックである。

まず、importを行う。
{ .. }内で宣言する。

import React, { useState } from 'react';

useStateをコンポーネント内で宣言する。
記述方法としては、const [変数名, 変数にセットする関数] = useState(初期値)である。
関数は変数と同じ型を取る。

例

例を挙げる。

const sample = () => {
	const [text, setText] = useState('');
}

これをbuttonなどで使用したいときには、

const sample = () => {
	const [count, setCount] = useState(0);
	
	return(
		<div>
			<button onClick={() => setCount(count + 1)}>
		</div>
	);
}

などと書く。