如題,在vue.js官方文件中看到computed和watch取得全名的一個例子:
var var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar',
fullName: 'Foo Bar'
},
watch: {
firstName: function (val) {
this.fullName = val + ' ' + this.lastName
},
lastName: function (val) {
this.fullName = this.firstName + ' ' + val
}
}
})
var var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar'
},
computed: {
fullName: function () {
return this.firstName + ' ' + this.lastName
}
}
})
菜鳥表示不太懂他們之間的區別,難道watch就不可以像computed那樣來獲取嗎?
用computed程式碼寫的少,沒什麼主要差別
我覺得還是有差別的,而且兩種應用的情形應該要區分。
計算屬性是計算屬性,觀察是觀察。
計算屬性顧名思義就是透過其他變數計算得來的另一個屬性,fullName在它所依賴firstName,lastName這兩個變數變化時重新計算自己的值。
另外,計算屬性具有快取。計算屬性是基於它們的依賴進行快取的。計算屬性只有在它的相關依賴發生改變時才會重新求值。這意味著只要 lastName和firstName都沒有改變,多次存取 fullName計算屬性會立即傳回先前的計算結果,而不必再執行函數。
而觀察watch是觀察一個特定的值,當該值變化時執行特定的函數。例如分頁元件中,我們可以偵測頁碼執行取得資料的函數。
可以再詳細的檢視一下文件:https://cn.vuejs.org/v2/guide...
更具可讀性,以及通常來說更少的程式碼。
簡單來看computed是基於快取進行的,watch等於一個函數。個人覺得會用就好了,具體區別移駕具體區別
覺得還是計算屬性用的能廣泛一些吧