You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
watchEffect cannot be used to watch data within asynchronous queues. If you specifically need to watch a variable, you should use watch. If you use watchEffect, you need to access the variable before entering the asynchronous queue.
Vue version
3.3.4
Link to minimal reproduction
https://cn.vuejs.org/api/reactivity-core.html#watcheffect
Steps to reproduce
import { ref, watchEffect } from 'vue'
const r = ref(0)
function sleep(time){ return new Promise((resolve)=>{ setTimeout(() => { resolve() }, time); }) }
watchEffect(async ()=>{
await sleep(500)
console.log('watch1',r.value)
})
setTimeout(() => { r.value = 2 }, 3000);
What is expected?
Should listen for changes in r
What is actually happening?
Only printed:
watch1 0
System Info
No response
Any additional comments?
I changed the code:
import { ref, watchEffect } from 'vue'
const r = ref(0)
function sleep(time){ return new Promise((resolve)=>{ setTimeout(() => { resolve() }, time); }) }
watchEffect(async ()=>{
console.log('watch1',r.value)
await sleep(500)
})
setTimeout(() => { r.value = 2 }, 3000);
Printed:
watch1 0
watch1 2
The text was updated successfully, but these errors were encountered: