Vue中的數據是通過聲明一個data對象來定義的。data對象包含了所有需要在模板中使用的數據。
data() { return { message: 'Hello Vue!' } }
這里聲明了一個名為message的屬性,它的值是'Hello Vue!'。
在模板中使用這個數據的時候,可以通過{{}}語法進行插值。
{{ message }}
這里把message數據插入到了一個div元素中。最終結果會是這個div元素會顯示'Hello Vue!'。
除了直接聲明data對象以外,Vue還提供了一個函數式聲明的方式,即使用data函數。
data: function() { return { message: 'Hello Vue!' } }
這種方式和上面的方式是等效的。使用data函數的好處在于可以使用this來訪問組件實例的所有屬性和方法。
總之,Vue中的數據都應該放在data對象中來進行定義。