[React Hooks] useState 데이터 변경(callback)

리액트를 사용하면 data를 양방향으로 바인딩이 가능하다.

 

리액트 컴포넌가 하나의 데이터를 바라보기 떄문이다.

 

그렇다면 리액트 데이터를 변경을 하면 데이터가 자동으로 갱신이된다.

 

const [data, setData] = useState({data : "data"});

 

리액트는 useState로 데이터를 생성하고 데이터를 props방식으로 공유한다.

 

데이터를 변경하려면 앞에서 변수로 선언한 setData

를 이용한다.

 

[리액트 데이터 참조방식]

리액튼는 얋은 참조를 반영하여 스프레트 문법인 ...을 통해 데이터를 갱신한다.

 

이 부분은 나중에 깊게 정리하려 한다.

 

지금 보려는 방식은

useState의 setData의 callback 방식을 보려한다.

 

[사용 예( callback 이용 데이터 가져오기)]

  setData(data =>{
      const updated = {...data};
        updated = '' //=>데이터 변경
        return updated;
    })

현재 useEffect로 선언한 data를 callback함수를 통해 가져올 수 있다.

그리고 return을 하면 데이터가 셋팅이 된다.   

[사용 예 (선언되어 있는 data가져오기)]

let updated = {...data}
update = '' //데이터 정재
setData(update);

그냥 단순하게 setData에 data값을을 호출해도 기능은 동작한다.

 

하지만 이럴 경우 동기적으로 호출이 안될 경우도 있다고 한다.