From 4215e640f2cf8151b748f56174528013906cdec5 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Mon, 16 Mar 2020 00:21:16 +0100
Subject: [PATCH] docs: use props in user page

---
 playground/router.ts      | 2 +-
 playground/views/User.vue | 8 +++-----
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/playground/router.ts b/playground/router.ts
index b1799192..e859f4b8 100644
--- a/playground/router.ts
+++ b/playground/router.ts
@@ -19,7 +19,7 @@ export const router = createRouter({
   history: routerHistory,
   routes: [
     { path: '/', component: Home },
-    { path: '/users/:id', name: 'user', component: User },
+    { path: '/users/:id', name: 'user', component: User, props: true },
     { path: '/documents/:id', name: 'docs', component: User },
     { path: encodeURI('/n/€'), name: 'euro', component },
     { path: '/n/:n', name: 'increment', component },
diff --git a/playground/views/User.vue b/playground/views/User.vue
index bcf2264a..8384bf8e 100644
--- a/playground/views/User.vue
+++ b/playground/views/User.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>User: {{ route.params.id }}</div>
+  <div>User: {{ id }}</div>
 </template>
 
 <script>
@@ -7,10 +7,8 @@ import { defineComponent, inject } from 'vue'
 
 export default defineComponent({
   name: 'User',
-  setup() {
-    const route = inject('route')
-    console.log('calling setup in User')
-    return { route }
+  props: {
+    id: String,
   },
 })
 </script>
-- 
2.47.3