使用Vue 3和Typescript观察模型属性

Question

我正在尝试监视我的Typescript模型属性，它可以工作，但在控制台中给出了一个警告，我找不到如何删除它。

这是我的Typescript模型：

import { watch, ref, Ref, reactive } from '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

Answer 1

您的类实例在某处被设置为Reactive，使其deferred_invoicing属性无法引用

使用

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