时间戳

首页 > 解决方案 > @Watch & $Refs 与 typescript 和 vue-property-decorator

typescript - @Watch & $Refs 与 typescript 和 vue-property-decorator

问题描述

我有一个关于手表和参考的问题。我有一个带有v-model. 的 setter 操作v-model需要很长时间（写入存储并触发 DOM 上的大量更新）。

不幸的是，Vue 在呈现开关的新值之前执行了该操作。我想立即显示输入值。我的解决方法是“观察”开关 inputValue 并在 inputValue 更改时执行 setter 操作。我怎样才能用打字稿和vue-property-decorator？我在我的开关上放了一个 ref 并尝试了这样的事情：

  @Watch("$refs.switch.inputValue", {
    immediate: true,
    deep: true,
  })
  change() {
    alert('value changed');
  }

@watch装饰器甚至可以做到这一点吗？

标签： typescriptvue.jsvuetify.jswatch

解决方案

您不能使用@Watch 来观看 $refs，因为$refs 的属性不是 reactive。你最好使用事件。您可能正在使用Vuetify 的 v-switch。您可以使用它的 change-event 并收听它：

<v-switch @change="valueChanged()"/>

...

valueChanged() {
  // handle change event
}

推荐阅读