javascript - Would watch() in Vue3 stop automatically at component unmounted? - Stack Overflow

admin管理员组

文章数量:1401673

According to Vue3 Doc, watchEffect will stop when a ponent is unmounted.

When watchEffect is called during a ponent's setup() function or lifecycle hooks, the watcher is linked to the ponent's lifecycle and will be automatically stopped when the ponent is unmounted.

Does watch has the same behavior in term of automatically stoppage? Thanks!

According to Vue3 Doc, watchEffect will stop when a ponent is unmounted.

When watchEffect is called during a ponent's setup() function or lifecycle hooks, the watcher is linked to the ponent's lifecycle and will be automatically stopped when the ponent is unmounted.

Does watch has the same behavior in term of automatically stoppage? Thanks!

• javascript
• watch
• reactive
• vuejs3

Share Improve this question Follow asked Apr 12, 2021 at 2:02 mannokmannok 1,87211 gold badge2222 silver badges3838 bronze badges 4

• 2 It seems so. See v3.vuejs/guide/…. – User 28 Commented Apr 12, 2021 at 4:45
• @User28 It did mention watch shares behavior with watchEffect in terms of manual stoppage. Seems for manual stoppage but not automatically stoppage – mannok Commented Apr 12, 2021 at 6:30
• 4 Umm, I was confused too. The manual stoppage links to the Stopping the Watcher which talk about automatically stopped. I create this to test. It seems that the watcher automatically stopped when the ponent is unmounted. – User 28 Commented Apr 12, 2021 at 10:02
• @User28 This is the answer. Thanks for you fiddle. – mannok Commented Apr 12, 2021 at 10:29

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Watchers declared synchronously inside setup() or are bound to the owner ponent instance, and will be automatically stopped when the owner ponent is unmounted. In most cases, you don't need to worry about stopping the watcher yourself.

Src: https://vuejs/guide/essentials/watchers.html#stopping-a-watcher

So the answer seems like, yes if you declare the watcher synchronously, and no if you declare it asynchronously.

It looks like watch()/watchEffect() return unwatch() functions that you have to call to stop asynchronously created watchers.

PS
This was mainly just a follow-up on @User28. The link in your ment was outdated but I couldn't edit it.

本文标签： javascriptWould watch() in Vue3 stop automatically at component unmountedStack Overflow