Does Vue have something similar to Svelte's destiny operator?

user_5982366 0
Viewed 83

This one-liner in svelte will execute anytime the value of someVar changes.

$: console.log({someVar});

Svelte calls this a reactive declaration, the code after the $ label, what Svelte calls the "destiny operator" will be executed whenever any variables referenced within it change.

This is really useful for debugging. Does Vue have something similar?

svelte vue.js javascript
1 Answers

The most similar API would probably be watchEffect():

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

Example:

<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>

demo

user_62771510
Related