state 사용법

1. import {useState}

2. useState(보관할 자료)

3. let [작명, 작명]
(Destructuring 문법이다)

 

Destructuring이란?
let [name, age] = ['Kim', 20]
그럼 각각 name = 'Kim',  age = 20 이라는 변수가 생성됩니다.
귀찮게 등호여러번 쓸 필요 없이 왼쪽 오른쪽 형식을 똑같이 맞춰주시면 자동으로 알아서 변수가 생성됩니다.
이게 변수만들 때 쓰는 destructuring 문법입니다.

 

<state를 사용하는 이유>

= state는 변동사항이 생기면 state쓰는 html도 자동으로 재렌더링해준다.

function App(){
  let [글제목, b] = useState('남자 코트 추천');

  return (
    <h4>{ 글제목 }</h4>
  )
}

남자 코트 추천을 여자 코트 추천으로 변경해주면
 state가 포함된 html을 자동으로 재렌더링 해준다.
 
 state를 쓰면 UI 기능 개발이 편리해진다.