RECOIL3 Recoil SelectorFamily의 파라미터 사용 중 인덱스 시그니처 오류 발생 (with TypeScript) 🥲 문제 발생 코드 interface ListParam { page?: number; pageSize?: number; orderBy?: "DESC" | "ASC"; sortBy?: string; total?: boolean; } type Param = ListParam; export const listQuery = selectorFamily({ key: "listQuery", get: (param) => async () => { const { data } = await getList(param); return data; }, }); Data는 API 요청 후 반환되는 데이터 타입입니다. Param은 Recoil의 파라미터에 들어갈 타입 입니다. getList 함수는 api를 호출하는 함수 입니다. 🤨 .. 2021. 6. 9. Recoil로 파라미터가 포함된 비동기 데이터 쿼리호출 (with TypeScript) 개요 Recoil로 비동기 데이터 쿼리를 호출 할 때 파라미터 유무에 따른 예제를 공유합니다. 전체적으로 코드에서 import 는 제외 하였습니다 🎃 파라미터가 필요 없는 경우 recoil의 selector를 이용해서 아래와 같이 비동기 데이터 쿼리를 호출 할 수 있습니다. 💁🏼♂️ 코드 예제 interface Data { data1: string; data2: number; data3: boolean; } type Response = AxiosResponse; const getData = (): Promise => axios.get('example.com/data'); const asyncDataQuery = selector({ key: 'asyncDataQuery', get: async () => .. 2021. 6. 2. Recoil의 설치 및 기본 개념 🥸 Recoil은 왜 개발 했을까? 호환성 & 단순함 측면을 봤을때는 다른 상태 관리 라이브러리 보다 React 자체에서 제공해주는 상태 관리 기능을 사용하는 것이 좋습니다. (useState 라던지…) 하지만 React도 한계가 있습니다. (미친듯이 거대한 상태 트리라던가… 미친 랜더링을 야기할 수 있다… 무서웡…) 그럼 어떤 장점이 있을까? Native하다! (동시성 모드 같은 새로운 React 기능들과 호환 가능!… 내가 동시성 모드를 잘모른다는건 함정;;) 사용하는데 간편하다 (hooks 사용자라면 더더욱!) ⚙️ 설치/세팅 방법 1. 설치 잘쓰는게 어렵지! 설치 방법은 쉽다! 🥲 당연히 프로젝트 Root 디렉토리로 이동한 후 아래 명령어를 실행해준다 Recoil은 계속 개발 중입니다! night.. 2021. 5. 25. 이전 1 다음