带有typescript和vue-property- $Refs装饰符的@Watch &$Refs

Question

我有一个关于watch和ref的问题。我有一台vswitch的v型车。v-model的setter操作需要很长很长的时间(写入存储并在DOM上触发大量更新)。

不幸的是，Vue会在呈现开关的新值之前执行该操作。我想立即显示输入值。我的变通方法是“观察”开关inputValue，并在inputValue为changED时执行setter操作。我如何使用typescript和vue-property-装饰器来做这件事？我在我的开关上放了一个裁判，并尝试了类似这样的东西：

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

使用@watch装饰器可以做到这一点吗？

谢谢&致以最良好的问候

Answer 1

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

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

..。

valueChanged() {
  // handle change event
}