programing

Vue 속성이 밑줄과 함께 유효하지 않습니다.

procenter 2023. 1. 13. 20:28
반응형

Vue 속성이 밑줄과 함께 유효하지 않습니다.

몇 가지 테스트를 하고 있는데 언더스코어를 사용했을 때 속성이 유효하지 않다는 것을 알게 되었습니다.

예:

new Vue({
el : "#form",

data: {
    errors: [],
    _username: '',
    _password: ''
});

html 파일:

<input class="uk-input" type="text" v-model="_username" >
<input class="uk-input" type="password" v-model="_password">

위의 코드를 사용하면 앱이 렌더링되지 않습니다.언더스코어를 삭제하면 동작합니다만, 그 원인을 알 수 있는 사람이 있습니까?

정답은 문서에서 찾을 수 있습니다.

로 시작하는 속성_또는$는 Vue의 내부 속성 및 API 메서드와 충돌할 수 있으므로 Vue 인스턴스에서 프록시되지 않습니다.다음 방법으로 액세스해야 합니다.vm.$data._property

템플릿에서 다음 항목을 참조해야 합니다.$data._username/$data._password(예:

<input class="uk-input" type="text" v-model="$data._username" >
<input class="uk-input" type="password" v-model="$data._password">

데모는 이쪽~https://jsfiddle.net/9bzxuecj/2/

언급URL : https://stackoverflow.com/questions/46270709/vue-property-not-valid-with-underscore

반응형