AxiosResponse<any, any>에 #속성이 없습니다.

생성일

Dec 11, 2021 11:15 AM

태그

TypeScript

작성자

해결 완료

🔥 문제

역시 타입 문제는 쉽지 않다. 이번에는 Axios에서 반환 값을 받아서 렌더링하려 했더니, 다음과 같은 에러를 내뱉는다.

아무래도 @axios/index에서의 AxiosResponse쪽에서의 문제인 것 같은데... 어떻게 해결할까?

⭐ 해결 방법

알고 보니, AxiosResponse에서의 타입 문제가 아니었다.

해결 방법은, axios로 REST API 요청을 하는 함수에 Type을 명시해주는 것이었다.

반환 값이 어떤 특정 인터페이스의 타입이라고 한다면... 결과적으로, 해당 속성이 있음을 타입스크립트가 추론이 가능한 것이다.

따라서 다음과 같이 타입을 주었다.


import request from '@axios/index';
import { Event } from '@contexts/event/types';

interface GetEventParamTypes {
  eventId: string | undefined | string[];
}

const getEvent = async ({ eventId }: GetEventParamTypes) => {
  /* eslint-disable no-console */
  if (typeof eventId === 'object') {
    console.warn('nowParam is array ', eventId);
  }

  const res: Event = await request.get('/e49e47f9-739a-4014-8395-efa1f810aebb');
  return res;
};

export default getEvent;

결과

오류가 나지 않는다!

AxiosResponse<any, any>에 #속성이 없습니다.

🔥 문제

⭐ 해결 방법

결과

👏🏻 참고자료