inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

Vue3 완벽 마스터: 기초부터 실전까지 - "실전편"

소스 & 교안

안녕하세요. 9번 브런치 돌리면 오류가 나요.

193

서나당

작성한 질문수 1

0

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

 

안녕하세요. 9번 브런치 돌리면 오류가 나요.

  list.vue 파일에서 하단에 상세보기 하는쪽입니다(id를 String 으로 변경하는과정에서요.)

axios 쪽에서 TypeError: relativeURL.replace is not a function 오류가 납니다.. 왜이럴까요~?

 

 

vue.js

답변 2

0

짐코딩

안녕하세요 🙂

해당 오류는 axios 로 get 요청을 할 때 파라미터가 문자열이 아닌 타입을 넘겨서 발생하는 오류로

아래와 같이 수정하시면 됩니다.

// 수전 전
export function getPostById(id) {
	return posts.get(id);
}
// 수정후
export function getPostById(id) {
	return posts.get(`/${id}`);
}

해당 버그는 다음 회차에서 함께 수정해요! 참고하시면 좋을 것 같아요.

감사합니다 :)

0

서나당

넵 감사합니다 😃

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. 서나당님, 질문 주셔서 감사합니다.

Vue3 프로젝트에서 axios를 사용할 때 발생하는 TypeError: relativeURL.replace is not a function 오류는 대개 잘못된 URL 형식이나 타입과 관련이 있습니다. 특히, id를 건드리는 과정에서 문자열로 변환하거나 사용하는 방식에 주의를 기울이셔야 합니다.

해결책

  1. ID의 타입 확인: 우선, id의 타입을 확인해 보세요. 변환 후에도 타입이 문자열(String)인지를 확인하는 것이 중요합니다.
   const id = String(someNumericId); // sure 변환이 되었는지를 확인
  1. Axios 호출 URL 확인: axios에서 요청을 보내는 URL이 올바르게 구성되었는지를 다시 한번 점검해보세요. 만약 변환 과정에서 URL 형식이 깨졌다면 이와 같은 오류가 발생할 수 있습니다.

  2. 디버깅 콘솔: axios 요청 전에 콘솔 로그를 통해 URL 및 각 변수를 찍어 보시는 것도 좋은 방법입니다. 이를 통해 의도치 않은 변환이 일어나는지 확인해 보세요.

  3. 해결 사례 참고:

    • 비슷한 문제를 해결한 무슨 에러인지…ㅡㅡ 예제에 대해서 참고하실 수 있습니다.
    • 또한, axios의 용법에 대한 공식 문서도 함께 참조하시면 큰 도움이 될 것입니다.

위의 내용을 참조하여 문제를 해결할 수 있으면 좋겠습니다. 추가적으로 궁금한 점이 있으시면, 질문 이어서 해주세요. 곧 지식공유자께서 도움을 주실 것입니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

질문드립니다.

0

32

0

unplugin-vue-components 질문드립니다.

0

37

2

강의듣다가 헷갈려서 질문드립니다.

0

31

1

와 짐코딩님 강의 들으면서 느끼는게 많네요.

0

32

1

질문드립니다.

0

32

2

라우터 인스톨 후 실행안됨

1

49

2

코드 자동 포매팅 질문

0

68

2

필터 watchEffect 질문입니다.

0

51

1

json-server 오류가 다른게 뜨네요

0

113

1

미리보기가 안됩니당...

0

69

2

unplugin-vue-components

0

81

2

TypeError 질문

0

52

1

v-model="show" :show="show" 같이 사용?

1

57

1

hash 모드 배포의 필요성?

0

61

2

.eslintrc.cjs 가 없습니다

0

95

2

title,content값이 비어서 저장되는데 제가 혹시 어떤 부분을 잘못 작성했는지 ㅜㅜ 알고싶습니다.

0

98

3

_title_like: "", 문의드려요 해당 값을 설정하면 list가 아에 안나옵니다.

0

64

1

@click.prevent="params._page = pageNum"> 에 .value를 안쓰는 이유가 궁금합니다.

0

71

2

중첩된 컴포넌트 문제

0

75

2

교안에 있는 부분이 아닌가요?

0

109

2

useAxios Proxy(Object) RefImpl

0

113

1

axios timeout

0

328

3

강의와 상관은 없지만, 궁금한 점이 있어 질문드립니다.

0

122

2

컴포넌트 분리 부분에서 오류가 나요ㅠㅠ

0

167

2