21.07.12 React/useState

리덕스 하기전에 알고 있었어야 할 내용이라 생각되지만 맨날 복붙 해서 쓰다가 이번에 완전히 이해할 수 있어서 적어본다

useState 즉, state값 갖고와서 쓴다는 뜻!
값을 수정해야 하는 경우 함수형 컴포넌트에서 상태를 관리할 때 사용한다.
한개의 useState는 한 개의 상태값만 관리할 수 있어서 여러개의 상태값관리할때는 여러개의 useState갖고와서 써야한다.

import React, { useState } from 'react'; //useState import

const Counter = () => {
//배열의 첫번째 원소는 상태 값, 두번째 원소는 상태 설정 함수
const [value, setValue] = useState(0);
return (

<div>
		<p>
    현재 카운터 값은 <b>{value}</b> 입니다.
  </p>
  <button onClick={() => setValue(value + 1)}>+1</button>//함수 호출시 배열이 반환되고 리렌더링.
		console.log(value); // 1 (기본값 0에서 1로 바뀌어있다.)
</div>

);
};

useState를 임포트 먼저 해오고!
useState() 여기서 괄호안에는 초기값넣어준다!

나는 아래에 처럼 적었다
const [title, setTitle] = useState('');
const onChangeTitle = (e) => {
setTitle(e.target.value);
};