使用Vue 3和Typescript觀察模型屬性

Question

我正在嘗試監視我的Typescript模型屬性，它可以工作，但在控制台中給出了一個警告，我找不到如何刪除它。

這是我的Typescript模型：

import { watch, ref, Ref, reactive } 從 'vue'

export default class Resa {
  public id: Number = 0
  public deferred_invoicing: Ref<Boolean> = ref(false)

  constructor(properties?: Object) {
    watch(this.deferred_invoicing, (newValue, oldValue) => {
      console.log(newValue)
    }
  }
}

監視是正常工作的，但是我在控制台中有這個警告[Vue warn]: Invalid watch source: false A watch source can only be a getter/effect function, a ref, a reactive object , or an array of these types.

我做錯了什麼嗎？

我已經嘗試使用字串'deferred_invoicing'而不是this.deferred_invoicing

this.deferred_invoicing

Answer 1

您的類別實例在某處被設定為Reactive，使其deferred_invoicing屬性無法引用

使用

watch(toRaw(this).deferred_invoicing, (newValue, oldValue) => {
      console.log(newValue)
    }