Vue 3.2 / Watcher for Prop not working in SFC + Script Setup

Question

My setup is as follows:

<script setup lang="ts">
const props = defineProps({
  count: {
    type: Number,
    default: 0
  }
})

const { count } = toRefs(props)

watch(count, (newValue, oldValue) => {
  console.log(newValue, oldValue);
})
</script>

The console log is never run.

If I on the other hand set { immediate: true }, it does run but only logs out the new value - old is always undefined.

What am I doing wrong here?

Thank you!

Answer 1

I had the same issue trying to add watchers on props in Composition API with script setup.

The solution proposed by Thomas in the question's comments solve the issue.

//Not working     
watch(props.count, () => {console.log('hello')})
//Working
watch(() => props.count, () => {console.log('hello')})