Vueメソッドvsウォッチャーvs計算されたプロパティ

Vue.jsは、メソッド、ウォッチャー、計算されたプロパティを提供します。どちらを使用するのか？

メソッドを使用する場合

DOMで発生するイベントに対応するため
コンポーネントで何かが発生したときに関数を呼び出すこと。計算されたプロパティまたはウォッチャーからメソッドを呼び出すことができます。

計算されたプロパティを使用する場合

既存のデータソースから新しいデータを作成する必要があります
1つ以上のデータプロパティから構築されたテンプレートで使用する変数があります
複雑でネストされたプロパティ名をより読みやすく使いやすい名前に減らし、元のプロパティが変更されたときに更新する必要があります
テンプレートから値を参照する必要があります。この場合、キャッシュされているため、計算されたプロパティを作成するのが最善です。
複数のデータプロパティの変更をリッスンする必要があります

ウォッチャーを使用するタイミング

データプロパティが変更されたときにリッスンし、何らかのアクションを実行したい
小道具の値の変化を聞きたい
1つの特定のプロパティを聞くだけで済みます（複数のプロパティを同時に見ることはできません）
特定の値に達するまでデータプロパティを監視してから、何かを実行したい

私の無料ダウンロードVueハンドブック

その他のvueチュートリアル：