如何手动阻止观察者？

Question

我需要停止watch（），但是文档并没有真正解释如何做到这一点。

该观察者运行直到循环完成（1000秒）：

const state = reactive({
    val: 0
})

watch(() => state.val, () => {
    console.log(state.val)
})

for (let i = 1; i < 1000; i++) {
    setTimeout(function timer() {
        state.val = state.val + 1
    }, i * 1000);
}

我如何在跑步后停止观察者？使用WatchEffect不是一个选项，因为对于我的用例，观察者需要在停止之前运行几次，这在这个简化的示例中没有描述。根据我的理解，观察效应仅运行一次（启动后）。

Answer 1

“手表”功能返回一个函数，该功能在调用时会停止观察器：

const unwatch = watch(someProperty, () => { });

unwatch(); // It will stop watching

仅观看一次更改：

const unwatch = watch(someProperty, () => {
   // Do what your have to do

   unwatch();
});

Answer 2

从VUE 3.5开始，除了终止外，还提供了暂停，如以下文档示例所示：

const { stop, pause, resume } = watch(() => {})

// temporarily pause the watcher
pause()

// resume later
resume()

// stop
stop()

• 反应性核心：watch（）