• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

useSWR data undefined 이슈.

22.11.27 22:16 작성 조회수 601

0

안녕하세요 제로초님.

useSWR을 통해 서버에 user 정보를 요청하면 서버에서 넘어오는 response는 정상적으로 넘어오는데 화면에서 사용하는 data가 undefined로만 찍히는 원일을 모르겠어 문의드립니다.
(추가로 로그아웃을 한것처럼 쿠키를 삭제하고 data를 찍어보아도 undefined가 찍힙니다. / response는 false로 오구요.)

 

fetcher.ts 는 {}를 생략해서 return 되게끔 해두었습니다.

import axios from "axios";

const fetcher = (url: string) => axios({ url, withCredentials: true }).then((res) => res.data);

export default fetcher;

 

Login.tsx 에서는 컴포넌트 최상단에 uswSWR을 사용해주었습니다.

const { data, error, revalidate } = useSWR("http://localhost:3095/api/users", fetcher);

 

호출되는 users api의 response를 console.log에 찍어도 그렇고 네트워크 탭에서 response를 열어봐도 정상적으로 데이터는 받아집니다.

제가 뭘 놓치고 있는지 시간되실 때 한 번 확인 부탁드리겠습니다.

답변 1

답변을 작성해보세요.

0

위에도 users 요청이 하나 더 있는데 그것도 확인해보세요.

김영욱님의 프로필

김영욱

질문자

2022.11.28

호출된 users는 모두 같은 response를 가지고 있습니다.
강의에 설치된 0.4.2 버전의 swr에서는 안되는데
최신버전으로만 라이브러리 설치해서 클론 진행중인 프로젝트에 1.3.0으로 설치된 swr은 같은에서 revalidate만 mutate로 변경한 후 정상적으로 동작하네요..

김영욱님의 프로필

김영욱

질문자

2022.11.28

음;; 혹시나 하는 마음으로 강의에 나온 버전으로 클론 코딩중인 프로젝트의 swr버전도 최신버전으로 올려보았더니 정상적으로 동작하네요;;;
이건 swr 구버전의 호환성 버그가 있었다고 간주하고 넘어가야 할 것 같습니다..ㅠ

혹시라도 원인이 될만한 내용이 짐작가시는게 있다면 알려주시면 다시 다운그레이드하고 체크해보겠습니다!

지금 생각해보니 data가 undefined인건 데이터 로딩 중일 때입니다.