vue3前端青銅到黃金王者 - 第10個入門computed使用set和get

語言: CN / TW / HK
ead>

這是我參與8月更文挑戰的第23天,活動詳情檢視:8月更文挑戰

前篇寫了computed屬性,但是我們發現不能修改computed屬性的值。

其實可以修改的我們再看看。

v computed是什麼?

計算屬性, 一個變數的值根據其他變數(一個或者多個)的變化,自動反映,算出新的結果。

我們可以使用 methods 來替代 computed,效果上兩個都是一樣的,但是 computed 是基於它的依賴快取,只有相關依賴發生改變時才會重新取值

好,複習前面的。我們這裡改造成get 和set方法。

程式碼如下:

```

vue3青銅到黃金-丸子醬-vue-0n

```

執行效果如下:

第一,我直接修改第三個繫結result computed屬性的。\ 結果是可以被修改到的。但是上面的result div塊不會被更新,因為result div內繫結的是get取值的方法。\ 在這裡插入圖片描述

第二,我直接修改第二個繫結num2 的屬性的。\ 頁面上所有的result div塊會被更新,因為result div內繫結的是get取值的方法。\ 在這裡插入圖片描述

我們發現computed屬性不允許修改,控制檯報錯了。(下一篇再講解)\ 其他更多讀者可以試試編寫一些computed屬性的程式碼,vue3還是增強了不少。

總結

computed 計算屬性: 適合計算一個屬性, 並且繫結.

computed 可以監控跟蹤到不同變數值的變化來自動計算出新的結果。

通過set/get方法讓computed屬性更加彈性了。

今天就寫到這裡。

我是丸子,每天學會一個小知識。\ 一個前端開發\ 希望多多支援鼓勵,感謝