useState

- 정의

value 값이 바뀌면 자동으로 리렌더링 해주는 함수.

컴포넌트에서 상태를 관리할 수 있음.

 

# 모듈 선언

import React, { useState } from "react";

 

 

# useState 선언

let [value, setValue] = useState(init);

ES6 destructuring 문법으로 useState에서 return 된 배열들이 해당 배열에 맞게 들어감.

첫번째 원소 value는 현재 상태 값 변수, 두번째 원소 setValue는 상태 값을 갱신해주는 Setter 함수이다. 

 

value = 변수

setValue = 변수를 변경해주는 함수

init = 해당 값으로 변수 초기화

 

 

ex)

  let [age, setAge] = useState(0); -> age의 초기값을 0으로 해줌.

  setAge(age => age + 1); -> age에 1을 더해주고 리렌더링