usesstate
Use state
ui랑 밀접하게 관련있는 데이터는 state라는곳에
보관해야함 !!!!!!!!!!!!!!!
const [count, setCount] = useState(0); //0원하는 초기값지정하면 배열이 리턴됨,첫번째 인자는 값에 접근할수있는 변수와 업데이트 할수 있는 함수 이름은 원하는걸로
Usestate
변경가능한 상태를 쓸때는 usestate를 사용해야흠
Prev 이전상태값
setCount((prev) => prev + 1);
리액트에서 상태를 사용할때는 그냥 일반 변수사용 하면
안된다 리액트에서 제공되는 usestate 를 써야한다
import React, { useState } from "react";
export default function Counter() {
const [count, setCount] = useState(0); //0원하는 초기값지정하면 배열이 리턴됨,첫번째 인자는 값에 접근할수있는 변수와 업데이트 할수 있는 함수 이름은 원하는걸로
return (
<div className="Counter">
<span className="number">{count}</span>
<button
onClick={() => {
setCount((prev) => prev + 1);
setCount((prev) => prev + 1);
setCount((prev) => prev + 1);
setCount((prev) => prev + 1);
}}
>
Add +
</button>
</div>
);
}
카운터를 만들어봄