반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- .NET Core Proxy
- SQLP
- 디자인 패턴 사례
- javascript
- vue.js
- Visual Studio 2015 설치
- Vue3 configureWebpack
- Visual Studio 2015 삭제
- Vue configureWebpack
- Visual Studio 패키지에 실패했습니다.
- vue
- vue3
- 웹 크롤링
- Nginx Reverse Proxy
- MSSQL 문자열
- 프록시 예제
- Visual Studio 재설치
- Selenium 환경
- Vue.config
- tomcat
- MSSQL 동적 쿼리
- 업무 자동화
- Tomcat Error
- Visual Studio 2015 강제 삭제
- 리버스 프록시 예제
- 웹 자동화
- .NET Core
- spring
- Visual Studio 강제 삭제
- Selenium 설치
Archives
- Today
- Total
금백조의 개발 블로그
[Vue.js] [Vue warn]: Property ~ was accessed during render but is not 에러 해결 방법 본문
Web/Vue.js
[Vue.js] [Vue warn]: Property ~ was accessed during render but is not 에러 해결 방법
금백조 2023. 4. 16. 18:00반응형
현상
Vue 강의를 보며 프로젝트를 진행하던 중 아래와 같은 에러메세지가 크롬 콘솔 창에 나타나면서 자식 컴포넌트가 화면에 나타나지 않았다.
[Vue warn]: Property "type" was accessed during render but is not defined on instance.
원인
부모 컴포넌트에서 type 객체를 자식 컴포넌트한테 전달해주려 하는데 자식 컴포넌트에 type이 props 내부에 선언되지 않은게 원인이었다.
parentComponent.vue (부모 컴포넌트)
<childComponent
:type="parentType"
/>
childComponent.vue (자식 컴포넌트)
<script>
export default {
props: {
},
type: {
type: String,
default: 'default type'
}
}
</script>
해결
자식 컴포넌트 props 내부에 type을 선언해준다.
childComponent.vue (자식 컴포넌트)
<script>
export default {
props: {
type: {
type: String,
default: 'default type'
}
}
}
</script>
반응형