$data是Vue的一個屬性,它表示Vue實例的數(shù)據(jù)對象。在Vue的開發(fā)中,$data是非常重要的一個屬性,它包含了當前Vue實例的所有數(shù)據(jù)以及相應的變化。通過訪問$data,可以讀取或修改Vue實例中的數(shù)據(jù)。
在Vue實例中,$data可以通過this.$data來訪問。例如,下面的代碼創(chuàng)建了一個Vue實例,并訪問了其中的$data:
var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) console.log(app.$data.message) // 輸出:Hello Vue!
可以看到,使用$this.$data可以直接訪問Vue實例中的數(shù)據(jù)對象。
在Vue實例中,可以直接修改$data中的數(shù)據(jù),從而改變UI展現(xiàn)。例如,下面的代碼通過修改$message屬性,改變了界面上的文本內(nèi)容:
var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) app.$data.message = 'Hello World!'
通過上面的代碼,頁面上的文本內(nèi)容就從"Hello Vue!"變成了"Hello World!"。
需要注意的是,改變$data中的數(shù)據(jù),會引起Vue實例所關聯(lián)的UI界面的更新。這個更新是自動完成的,無需手動調(diào)用更新函數(shù)。