watchの使い方 Vue.js

watchの使い方

watch(監視対象, 監視対象が変化したときに実行する関数)

watch のコールバックには2つの値を受け取ることができます。

watch(totalThisMonthAmount, (newAmount, oldAmount) => {
  console.log('変更前:', oldAmount)
  console.log('変更後:', newAmount)
})

例えば、

変更前: 45000
変更後: 55000

となります。

なので、

newAmount → 変更後の値
oldAmount → 変更前の値

と覚えておけばOK。

実際の使用例

watch(totalAmount, (newAmount) => {
  if (newAmount > 50000) {
    console.log('今月の支出が5万円を超えました')
  }
})