ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • recoil 써보장
    프로젝트 세팅 2022. 8. 30. 18:28

    atom : 화면전체에 공유가능한 기본 데이터를 정의하는 기능. { key, default } 가 들어가며, default에 정의한 데이터를 여기저기 불러올 수 있다.

    selector : 데이터를 읽고 쓸 때, 유효성 검사 등 부수적인 로직을 추가할 수 있다. selector 내부에서도 다른 atom이나 selector를 참조할 수 있다(구독). 이렇게 구독하고있는 상태가 외부에서 변경되면 본 selector는 이를 감지하고 컴포넌트를 리렌더링을 해준다. 필수로 정의하는 { get } 함수와 선택적으로 정의하는 { set } 함수가 있다.

    읽기전용 vs 쓰기전용?

    만약 get 만 정의된 selector를 사용한다고 할 때, 읽기 쓰기 모두 가능한 훅을 이용하면 발생하는 오류를 미연에 방지하기 위해서 함수를 구분해서 쓰도록 권고하고 있다.

     

     

    import { useRecoilRefresher_UNSTABLE, useSetRecoilState } from 'recoil';
     
    useRecoilState : 리코일에 저장된 default 값을 가져온다.
    useSetRecoilState :  API를 통해 불러온 데이터를 기존에 저장된 default 값과 교체해준다. 
    useRecoilValue : useRecoilState와 비슷하지만 '읽기전용'이다.
    useResetRecoilState : 변경되었던 리코일 default 값을 기존 값으로 초기화시켜준다. 컴포넌트가 언마운트 되는 시점에 이 값을 초기화해주지 않으면 향후 신규 등록시 기존데이터가 그대로 불러와지는 오류가 발생하게 된다.
     

     

    selector

     

    '프로젝트 세팅' 카테고리의 다른 글

    웹소켓?  (0) 2022.09.21
    Better Comments 익스텐션  (0) 2022.09.16
    fonts 디렉토리에 폰트 정의하기  (0) 2022.08.29
    제플린으로 이미지 받고 assets에 정리하기  (0) 2022.08.29
    깃 pull이랑 merge의 차이??  (0) 2022.08.23
Designed by Tistory.