computed 計算屬性無法雙向繫結
阿新 • • 發佈:2019-02-14
v-model 這種雙向資料繫結最好不要放在計算屬性上,因為計算屬性本來就響應依賴其他的東西,
雙向繫結感覺會破壞它的原有機制
重新編輯一下,剛剛研究了一下,可能不是很透徹
實現你說的那種,需要加一箇中間的依賴屬性,為什麼呢,我是這樣理解的computed
裡的return
,實際上是一個get方法,
就是每次vm.someComputed
或者頁面相應變化的時候{{someComputed}}
,實際上訪問的是它的get方法
如果只有return的話,是無法實現雙向資料繫結的,因為並沒有set資料啊,
這樣永遠獲得的都是return裡面的值,如果響應依賴的話就get依賴進行運算的值,如果是個常量就會一直返回常量
我們可以增加一個可以做中轉的依賴屬性,重寫計算屬性的set和get方法,這樣就能實現計算屬性
new Vue({
el: '.app',
data: {
foo: 'test',
},
computed: {
_foo: {
set: function(value) {
this.foo = value;
},
get: function() {
return this.foo
}
}
}
})
這樣的本質其實還是foo在發生改變,但是當你在input
看起來就好像計算屬性_foo和dom實現了資料繫結