watch — explicit dependencies. watchEffect — auto dependencies.
watch:
watchEffect:
1<script setup>2import { ref, watch, watchEffect } from "vue"34const query = ref("")56// watch7watch(query, (newVal, oldVal) => {8 console.log(`Changed from ${oldVal} to ${newVal}`)9})1011// watchEffect12watchEffect(() => {13 console.log(`Query is: ${query.value}`)14})15</script>
Key: watch for explicit, watchEffect for auto.