并不是這樣的，data在子組件里是一個函數，是為了告訴你，這個數據是這個組件獨享的，不要和其他組件公用，避免沖突。

官網上有非常好的解釋, 請點擊這里,?data必須是一個函數

// 直接聲明的對象只占某一塊內存空間，對它的所有引用共用該空間。

var data = {

? id: 'abc',

? count: 100

}

console.log('type:', typeof data)

var a = data

var b = data

console.log('a.id=', a.id)

a.id = '007'

console.log('a.id=', a.id)

console.log('b.id=', b.id)

// 方法每次返回的對象在內存中占用不同塊空間，每個引用各自維護自己的空間。

function dfunc() {

? return {

? ? id: 'default_value',

? ? count: 1

? }

}

console.log('type:', typeof dfunc)

var a1 = dfunc()

var b1 = dfunc()

console.log('a1.id=', a1.id)

a1.id = '008'

console.log('a1.id=', a1.id)

console.log('b1.id=', b1.id)

猜測：

Vue 在獲取data 這個組件的成員時會先判斷其類型，如果是一個對象則直接引用，如果是一個函數則獲取函數的返回值。

以上代碼就是模擬Vue 獲取data 對象的過程，當data 直接是一個對象時所有該組件的實例公用一份數據，當data 時函數時每個組件實例維護自己的數據。

子組件里面的data是函數是因為當我們頁面中運用同一個子組件多次，要是data只是一個對象的話，相同子組件就會共享這個data對象，這是一件非常糟糕的事情。寫成函數返回一個對象是想讓子組件有自己的data對象而不與其它組件共享

這是es6的語法，可以更好的優化頁面性能吧