/**
* 挑战 1: Watch 一次
* 确保副作用函数只执行一次
*/
const unWatch = watch(count, () => {
console.log("Only triggered once")
unWatch()
})
/**
* 挑战 2: Watch 对象
* 确保副作用函数被正确触发
*/
const state = ref({
count: 0,
})
watch(state, () => {
console.log("The state.count updated")
}, {
deep: true
})
state.value.count = 2
/**
* 挑战 3: 副作用函数刷新时机
* 确保正确访问到更新后的`eleRef`值
*/
const eleRef = ref()
const age = ref(2)
watch(age, () => {
console.log(eleRef.value)
}, {
flush: 'post' // 'pre' | 'post' | 'sync' default: 'pre'
})
age.value = 18
<template>
<p ref="eleRef">
{{ age }}
</p>
</template>
watch一次、深度watch、访问dom更新后的`eleRef`
于 2023-12-14 15:54:06 首次发布