$$config title: [리액트 React] 선택 상자, 버튼, 배열 저장 keywords: - IT - 리액트 $$ # 변수 (동적변수) ``` js const [num, setNum] = useState(0); const [arr, setArr] = useState([]); ``` usdState(0) : 0을 초기값으로 둔다. useState(\[]) : 배열을 사용하겠다. # 선택상자 ```js setNum(e.target.valueAsNumber)} /> ``` 값이 변경될 때 마다 새로만든다. onChange={(e) => setNum(e.target.valueAsNumber) 에서 e 는 매개변수이다. (마음대로 설정 가능) # 버튼 (저장, 취소) ```js const save = () => { setNum(0); setArr([...arr, num]); };

``` setArr\[...arr,num] : 배열에 num값을 저장함 (num) ※ 자바 스크립트에서는 ...는 배열임을 알려준다. : 간격을 둠 \

: 밑줄을 만들어줌 # 배열 저장 ```js

{num}

``` - \

태그는 definition list의 약자로, 사전처럼 용어를 설명하는 목록을 만듭니다. - \

태그는 list item의 약자로 \

num : {num}

nums : {JSON.stringify(arr)}

{num}

, document.getElementById("root")); ``` https://codepen.io/denist2322/pen/PoQjgYa