본문 바로가기
리액트

리액트

by 픠버 2022. 12. 8.

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>

  );

}

카운터를 만들어봄

'리액트' 카테고리의 다른 글

투두리스트  (0) 2022.12.14
TodoList 연습  (0) 2022.12.13
리액트  (0) 2022.12.09
react  (0) 2022.12.07
React  (0) 2022.12.05