Vue: 빈 바인딩된 소품으로 인해 렌더링 예외가 발생합니다.

에 만든 2017년 03월 14일 · 3코멘트 · 출처: vuejs/vue

Vue.js 버전

2.2.4

재생산 링크

https://jsfiddle.net/wwuyv17z/

재현 단계

<test :user=""></test> 와 같이 바인딩된 소품에 아무 것도 전달하지 않습니다.

무엇을 기대합니까?

최악의 경우 콘솔에 경고가 표시되고 충돌이 발생하지 않을 것입니다. 기껏해야 소품이 구성 요소에 null 값을 제공할 것으로 기대합니다.

경고 또는 null 교체가 발생해야 한다는 데 동의한 경우 이 변경을 직접 시도하고 요청하게 되어 기쁩니다.

실제로 무슨 일이 일어나고 있습니까?

다음과 유사한 오류가 발생합니다.

[Vue warn]: Failed to generate render function:

SyntaxError: Unexpected token } in

with(this){return _c('div',{attrs:{"id":"app"}},[_c('test',{attrs:{"user":}})],1)}

(found in <Root>)

출처

jameshulse

👍1

모든 3 댓글

예상됩니다. 개체 필드에 값을 지정하지 않으면 JS에서도 구문 오류가 발생합니다.

yyx990803 에 2017년 03월 14일

👍1

에반님 답변 감사합니다.

알겠습니다. 바인딩된 props가 기본적으로 javascript 속성이라는 사실에 대해 이해하고 나면.

그렇다면 Vue에는 개발 모드에서 오류 검사라는 개념이 있습니까? 방금 이 문제에 직면한 초보자를 도왔습니다. 다음과 유사한 내용을 받았다면 문제를 스스로 해결할 수 있었을 것입니다.

[Vue warn] Bound property 'user' should not be empty on component 'test'

유용하다고 생각되면 다시 시도하고 추가하게 되어 기쁩니다.

jameshulse 에 2017년 03월 14일

👍1

예, 이것은 value here 을 확인하여 가능해야 합니다. PR 작업을 하는 경우 수반되는 테스트 케이스를 포함해야 합니다.