From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Tue, 27 Apr 2021 11:23:41 +0000 (+0200)
Subject: docs: directly watch a specific param
X-Git-Tag: v4.0.7~19
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=70bebfcd84492faf4f716c87f0a739f3a25ad765;p=thirdparty%2Fvuejs%2Frouter.git

docs: directly watch a specific param
---

diff --git a/docs/guide/advanced/composition-api.md b/docs/guide/advanced/composition-api.md
index d8e344e1..d4daf1d6 100644
--- a/docs/guide/advanced/composition-api.md
+++ b/docs/guide/advanced/composition-api.md
@@ -26,7 +26,7 @@ export default {
 }
 ```
 
-The `route` object is a reactive object, so any of its properties can be watched and you should **avoid watching the whole `route`** object:
+The `route` object is a reactive object, so any of its properties can be watched and you should **avoid watching the whole `route`** object. In most scenarios, you should directly watch the param you are expecting to change
 
 ```js
 import { useRoute } from 'vue-router'
@@ -38,9 +38,9 @@ export default {
 
     // fetch the user information when params change
     watch(
-      () => route.params,
-      async newParams => {
-        userData.value = await fetchUser(newParams.id)
+      () => route.params.id,
+      async newId => {
+        userData.value = await fetchUser(newId)
       }
     )
   },