Props

支柱バー
構成部品の外部で構成部品の値を指定します.
本体は構成部品です.外部値ではありません
素子に値を割り当てるためにpropsを素子の関数パラメータに入れます.
これで、外部から価格を受け取る準備ができました.
構成部品を使用する場合、外部から任意の値が与えられると、その値はpropsになり、構成部品の関数になります.例:

const Greet = (props) {
    console.log(props)
    return <div> 나는 {greet.name}이라고 해. 내 나이는 {greet.age}살이야.</div>
}

Greetという素子があると仮定します.
propsは無条件のゲストなのでnameはpropsオブジェクトのnameキー、propsです.ageはpropsのageキーです.したがって,外部から入力された値はnameとageというキーにある可能性があると推測できる.
では、外部から入る方法は何でしょうか.

function App() {
    return (
        <Greet name="김이름" age="20" />
    );
};

このような形で命名することもできます.

let manyGreet = [
    {   id : 1
        name : 김이름,
        age : 20
    },
    {   id : 2
        name : 박성함,
        age : 50
    },
    {   id : 3
        name : 이네임 
        age : 30
    },
]

このように、配列に含まれるオブジェクトの形状を付与することもできる.
そうすると、外から入る方法が変わります.

return (
    {manyGreet.map((greet) => {
        return <Greet key={greet.id} greet={greet} />
    })}
)

コンポーネントグループへのオブジェクトの再配置(万年グループ配列)
リトラクトでmapメソッドを使用する場合は、キー値としてidをキー値として使用する必要があります.
greetキーには、配列内のオブジェクトがそれぞれ含まれます.
まだあります.

const Greet = (props) {
   const greet = props.greet
    return <div> 나는 {greet.name}이라고 해. 내 나이는 {greet.age}살이야.</div>
}

greetの名前と年齢が必要なので、propsのgreetキー(すなわち、各オブジェクトを配列する)をgreet変数に入れます.

State

stateとpropsの違いは、propsが外部から値を受け取り、stateが内部から値を変えることです.
state userStateという名前の関数を使用

function TrueOrFalse() {
  const [isTrue, setIsTrue] = useState(false);
  //[저장되는변수, 변수에 대한 함수] = useState(변수의 초기값);

初期値falseはsetisTrueという関数によってisTrueという変数に格納されます.
state変数に格納されている値を使用するには、JSXに直接ロードするだけです.

<div> {isTrue ? 'True' : 'False' } </div>

setIsTrueを更新可能変数の関数として呼び出してstateをリフレッシュ

function TrueOrFalse() {
const [isTrue, setIsTrue] = useState(false);

 const handleOnClick = (event) => {
  setIsTrue(!isTrue);
   
   return (
  <div className="App">
    <input type="button" value='true?' onClick={handleOnClick} />
    <span>{isTrue ? "True" : "false"}</span>
  </div>
);
}  
};

これにより、クリック実行イベントに対してsetisTrue関数が実行され、結果値はisTrueに入ります.
次のTILで後続を作成

最後に...

今日習った内容ですが、明日の授業はすべてsprintなので、2つの部分に分けて、明日state理論の残りの部分と実習内容を書きます.REACTを勉強しているうちに難しいところもたくさんありましたが、面白いところもあり、利用できるところもたくさんあるので、しっかり勉強しなければならないと思います.