45

Author: kossiecoder

src/pages/todos/_id.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>Todo Page</div>
+</template>
+
+<script>
+import { useRoute } from 'vue-router';
+
+export default {
+    setup() {
+        const route = useRoute();
+
+        console.log(route.params.id);
+    }
+}
+</script>
+
+<style>
+
+</style>

src/router/index.js

@@ -1,6 +1,7 @@
 import { createRouter, createWebHistory } from 'vue-router';
 import Home from '../pages/index.vue';
 import Todos from '../pages/todos/index.vue';
+import Todo from '../pages/todos/_id.vue';
 
 const router = createRouter({
     history: createWebHistory(),
@@ -14,6 +15,11 @@ const router = createRouter({
             path: '/todos',
             name: 'Todos',
             component: Todos
+        },
+        {
+            path: '/todos/:id',
+            name: 'Todo',
+            component: Todo
         }
     ]
 });