state변경하려면 state변경함수를 써야함!

리액트에서 클릭시 보이는 UI 만드는 법 (일종의 온오프 스위치를 만들면 됨)

1. 일단 UI가 보이는/보이지않는 상태정보를 state로 만들어둠
   기본값 true / false 를 이용해서 UI가 보이고 안보이고 스위치 역할하게 함.

2. state가 true일 때만 UI를 보여줌

3. <열기버튼>을 누르면 state가 true로 바뀌도록 버튼에 기능개발함

function App (){

  let [modal, modal변경] = useState(false);
  return (
    <div>
      HTML 잔뜩있는 곳
      // onClick안에는 무조건 함수만 들어옴 
      <button onClick={ () => {modal변경(!modal) } }> 열기버튼 </button>
        // 리액트에서 HTML UI를 조건에 따라 보여주고 싶으면삼항연산자를 이용
        //리액트 중괄호 안에서 if문 사용 불가
	  {
         modal === true
         ? <Modal />
         : null
      }
    </div>
  )
}

이렇게 리액트에선 보이고 안보이고 모달창을 state로 관리함
UI가 보이는지/ 안보이는지의 상태

Q. 오잉 왜 state 변경할 때 복사본을 만들어서 수정하라매?

A. 사본만드는건 reference 자료형들만 하시면 됩니다. array, object 이런거요.
문자, 숫자, true/false 이런건 필요없이 직접수정하셈