Tip#14 Private data in Vue.js

Marcos Neves
vuejs-tips
Published in
1 min readMar 28, 2017

Why naming data like _value doesn't work?

The code below, should output "FooBar FooBar", but the actual output is "FooBar undefined".

 data: {
value: 'FooBar',
_value: 'FooBar'
},

mounted () {
console.log(this.value, this._value)
}

That's because properties starting with _ or $ are reserved for Vue itself.

If you need to create private properties, you have to choose a different name, like editableValue for example. Other suggestion is to use _ and $ as suffix, like value_ or value$.

But you can use them for methods and computed properties.

--

--

Marcos Neves
vuejs-tips

Ancient Brazilian web developer, from php, through Rails to Javascript, Vue.js enthusiast to React.