State

≪ステータス｜Status｜emdw≫

絶えず変化する特定の状態

の状態によって、動作ごとに異なる動作がある:

人間の飢餓状態

例)DarkMode、LightModeをスイッチに変更する

DarkMode일때는 배경이 어두워지고 글씨가 밝게
LightMode일때는 배경이 밝아지고 글씨가 어둡게

カウンタの例を見てみましょう。

0から+で1をインクリメントし、-で1をインクリメントするcount状態

import React, {useState} from 'react';

const Counter = () => {

    const [count, setCount] = useState(0);

    const onIncrease = () => {
        setCount(count + 1)
    }

    const onDecrease = () => {
        setCount(count - 1)
    }

    return (
        <div>
            <h2>{count}</h2>
            <button onClick={onIncrease}>+</button>
            <button onClick={onDecrease}>-</button>
        </div>
    )
}

(re-render)

配列の非構造化配分によりcount,setCountは

を受信する.

count:ステータス値

setCount:count状態変化関数

usState(0):0はcountの初期値

です.

=>count状態が変更されると、カウンタ構成部品の戻りが再実行されます。

1つの構成部品に複数のstateを使用できます.공부하며 정리&기록하는 ._. 씅로그