stateとpropsの違い

propsとstateは、通常のJavaScriptオブジェクトです.
どちらのオブジェクトにもレンダリングの成果物に影響を与える情報がありますが、違いがあります.

props(関数パラメータなど)は素子に渡される。

state(関数で宣言された変数など)は、構成部品で管理されます。

State

userStateという名前のReact Hooksでご利用いただけます

説明リンク!
https://ko.reactjs.org/docs/hooks-intro.html

import { useState } from 'react'

export default function CounterStatePage(){
    const [count, setCount]=useState(0)

    function counter(){
        setCount(count + 1)
    }

    return (
        <div>
            <div>{count}</div>
            <button onClick={counter}>카운트 올리기!!</button>
        </div>
    )
}

count=変数名
setCount=置換変数
useState=変数の作成
0=初期値
countという変数名が作成され、初期値は0(usState(0))に設定されています.
counterという名前の関数をsetCountという名前で作成します.
onClickでcounter関数を実行

Props

親構成部品が子構成部品に継承する変数または関数.

props ={aaa: handleChangeWriter}
html部分に機能を入れる必要がある場合はpropsを用いて移動して実現する
親は子供にしかあげられないが,子供は親にあげられない.
reactでは、データストリームは一方向です.
直感的で簡潔なデータ構造を実現

感情から支える方法

感情的に道具を直接動かす
矢印関数の使用

background-color : ${(props) => props.aaa};