effectScope 可以直接控制响应式副作用的施放时间
<script setup>
import { reactive, watch, watchEffect, computed, effectScope } from "vue";
const scope = effectScope() // 创建一个作用域
const data = reactive({
counter: 0,
incrementCounter: ''
})
setInterval(() => {
data.counter++
}, 1000)
scope.run(() => { // 将所有的产生副作用的函数 收集起来
data.incrementCounter = computed(() => data.counter * 2)
watch(
() => data.counter,
(newVal, oldVal) => {
console.log(`新值${newVal}---旧值${oldVal}`)
}
)
watchEffect(() => {
console.log(data.counter, 'watchEffect')
})
})
setTimeout(() => { // 将来在不需要的时候 将所