vue的computed和watch比較

  1. vue 的 computed 和 watch 比較
    1. 語法差異
    2. 語意上的差異

vue 的 computed 和 watch 比較

最近在學vue,學到了watchcomputed時,發現它們兩個極像又很難區分。

今天早上騎車時,想到了它們之間的差別了!就趕快來記錄下來。

語法差異

在此也順便的比較了datamethods
watch在語法上的特性是可以和data同名,我自己理解成是掛在dataonchange事件上的function

觸發方式 呼叫方式 必須和變數同名? 呼叫
data 「變數」被賦值,渲染 view o vue.value
watch 「同名的變數」被賦值就執行 o vue.value
computed 「取用的變數」被賦值就執行 x vue.xValue
methods 被呼叫就執行 x vue.value()

語意上的差異

在使用上,vue是一種接 api 資料之後,再將接到的資料,填入html的內容。
所以!!!先被決定的是接到的「資料欄位」,也就是data

  • watch 使用時機
    改變data時,要非同步執行的函數。
    運算負擔很大時的函數
  • computed 使用時機
    一種寫getset的設計。

以上是不負責任的…新手小小心得。