Disturb
Disturb

Reputation: 598

Vue property not valid with underscore

I was doing some tests and I noticed that my properties are not valid when I used underscore.

Example:

new Vue({
el : "#form",

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

on html file:

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

With the code above the app won't render. If I remove the underscore it will work, does someone knows why this happens?

Upvotes: 11

Views: 5266

Answers (1)

Phil
Phil

Reputation: 164895

The answer may be found in the documentation

Properties that start with _ or $ will not be proxied on the Vue instance because they may conflict with Vue’s internal properties and API methods. You will have to access them as vm.$data._property

In your templates, you will have to reference $data._username / $data._password, eg

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

Demo here ~ https://jsfiddle.net/9bzxuecj/2/

Upvotes: 10

Related Questions