1. 程式人生 > 實用技巧 >VUE 計算屬性和方法

VUE 計算屬性和方法

我們可以將同一函式定義為一個方法而不是一個計算屬性。兩種方式的最終結果確實是完全相同的。然而,不同的是計算屬性是基於它們的響應式依賴進行快取的。只在相關響應式依賴發生改變時它們才會重新求值。這就意味著只要message還沒有發生改變,多次訪問reversedMessage計算屬性會立即返回之前的計算結果,而不必再次執行函式。

這也同樣意味著下面的計算屬性將不再更新,因為Date.now()不是響應式依賴:

computed: {
  now: function () {
    return Date.now()
  }
}

相比之下,每當觸發重新渲染時,呼叫方法將總會再次執行函式。

我們為什麼需要快取?假設我們有一個性能開銷比較大的計算屬性A,它需要遍歷一個巨大的陣列並做大量的計算。然後我們可能有其他的計算屬性依賴於A。如果沒有快取,我們將不可避免的多次執行A的 getter!如果你不希望有快取,請用方法來替代。