Computed 計算屬性

Chun
2 min readSep 23, 2020

Computed 屬性介紹

在 computed 裡所宣告任何屬性都是一個 function,並且都會將值 return 出來,可經由 computed 屬性,將計算後的值代回 data 資料裡,將將值顯示在畫面上。可運用在需要重複使用的表達式上。

computed 的觸發條件是透過 data 裡面的值,當data 裡面的值受到更動的時候, computed 的結果才會跟著做更動,如果說你的值並不是在這個 data 內,computed 是無法被觸發的。

如下範例,reverseText 這個方法,會受到 data 裡面的 text 做觸發更動。

Methods 與 Computed 的使用時機

  1. computed:只要資料更動就會出發執行。一般來說不會修改資料,只會回傳用於畫面呈現的資料
  2. methods:需要經由觸發事件才會運作,用來修改資料內容。

在效能上,如果資料量大,computed 會比較慢,只要資料變動就會觸發,執行次數也會增加,因此在大量資料時,建議使用 methods 減少不必要的運算

--

--