-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
해결됨
안녕하세요 용주님 질문이 있습니다~
23.06.03 22:49 작성 조회수 299
1
server state 관리를 swr 말고 react-query를 사용하려고 합니다.
아래와 같이 해당 queryKey를 가지고 stores에 대한 data를 전역으로 관리하고 싶었는데, fetchFunction 자리에 stores props가 들어갈 수 없어서 처음에 어떻게 initialdata를 가져올 수 있을지 잘 모르겠습니다.. react-query는 수업때 배우진 않지만 혹시 아시는 부분이 있다면 알려주시면 감사하겠습니다 !!
const { data } = useQuery([queryKey], fetchFun)
답변을 작성해보세요.
0
박용주
지식공유자2023.06.04
안녕하세요! 질문 감사합니다.
react-query는 서버 상태에 대한 비동기 처리를 다루기 때문에 아래의 코드가 가장 기본적인 코드입니다.
const { data } = useQuery(['stores'], () => {
return fetch(`/api/stores`).then((response) => response.json());
});단순하게 전역 상태를 index page에서 저장하고 다른 컴포넌트에서 사용하는 로직이라면 아래의 코드도 가능해보입니다.
// index page
const queryClient = useQueryClient();
queryClient.setQueryDefaults(['stores'], { queryFn: () => stores });
// components
const { data } = useQuery({ queryKey: ['stores'] });하지만 mutation 등의 확장성을 고려했을 때 좋은 설계는 아닙니다.
react-query는 swr과 사용법이 다르기 때문에 기존 로직(currentStore 등)을 react-query로 모두 바꾸려면 새로운 설계를 생각하셔서 전반적으로 변경하는 것이 좋아보입니다!
감사합니다 :)
답변 1