Vue 實(shí)例的數(shù)據(jù)對(duì)象。Vue.js 會(huì)遞歸地將它全部屬性轉(zhuǎn)為 getter/setter，從而讓它能響應(yīng)數(shù)據(jù)變化。這個(gè)對(duì)象必須是普通對(duì)象：原生對(duì)象，getter/setter 及原型屬性會(huì)被忽略。不推薦觀察復(fù)雜對(duì)象。
在實(shí)例創(chuàng)建之后，可以用 vm.$data 訪問原始數(shù)據(jù)對(duì)象。Vue 實(shí)例也代理了數(shù)據(jù)對(duì)象所有的屬性。
在定義組件時(shí)，同一定義將創(chuàng)建多個(gè)實(shí)例，此時(shí) data 必須是一個(gè)函數(shù)，返回原始數(shù)據(jù)對(duì)象。如果 data 仍然是一個(gè)普通對(duì)象，則所有的實(shí)例將指向同一個(gè)對(duì)象！換成函數(shù)后，每當(dāng)創(chuàng)建一個(gè)實(shí)例時(shí)，會(huì)調(diào)用這個(gè)函數(shù)，返回一個(gè)新的原始數(shù)據(jù)對(duì)象的副本。

文件寫成.vue的文件就是組件的寫法，因此這時(shí)data必須是一個(gè)函數(shù)，而你貼的var vm = new Vue({})是直接跑在瀏覽器環(huán)境下的用法，這時(shí)data可以是一個(gè)普通對(duì)象，也可以寫成一個(gè)返回普通對(duì)象的函數(shù)，不過沒必要。

數(shù)據(jù)控制離要data面做種操作
data屬性依賴關(guān)系建議直接使用計(jì)算屬性吧且函數(shù)邏輯自新建method處理整組件更清晰些建議

在一個(gè)普通的 Vue app 中，data 是一個(gè)對(duì)象：

123456789new Vue( { data : { title : 'abc' }} );

在 Vue 的 Component 中，data 要寫成一個(gè) function，并返回對(duì)象：

12345678910111213Vue.component( 'component-name', Vue.extend( { data : function() { return { title : 'abc' }; }} ) );

The "data" option should be a function that returns a per-instance value in component definitions.
但是我看文檔里出現(xiàn)的data都是一個(gè)對(duì)象，比如：

var vm = new Vue({
data: {
a: 1
},
created: function () {
// `this` 指向 vm 實(shí)例
console.log('a is: ' + this.a)
}
})
// -> "a is: 1"