Vue 有类似于 Svelte 的命运操作员的东西吗？

Question

当某个变量的值发生变化时，这个单行代码将在任何时候执行。

$: console.log({someVar});

Svelte将此称为反应性声明，即$标签后面的代码，Svelte将其称为"命运操作符"。将在其中引用的任何变量发生变化时执行。

这对调试非常有用。我们有类似的产品吗?

Answer 1

最相似的API可能是watchEffect():

watchEffect(() => console.log(someVar.value))

例子:

<script setup>
import { ref, watchEffect } from 'vue'
const someVar = ref(0)
watchEffect(() => console.log(someVar.value))
</script>
<template>
<button @click="someVar++">Increment {{ someVar }}</button>
</template>

演示