feat: 更新

src/router/routes.ts

@@ -13,35 +13,99 @@ const routes = [
       { 
         path: "/reactivity/reactive", 
         name: "reactive", 
-        meta: { title: "reactive基础用法" }, 
+        meta: { title: "reactive" }, 
         component: () => import("@/views/reactivity/ReactiveBase.vue")
       },
       { 
         path: "/reactivity/ref", 
         name: "ref", 
-        meta: { title: "ref基础用法" }, 
+        meta: { title: "ref" }, 
         component: () => import("@/views/reactivity/RefBase.vue")
       },
       { 
         path: "/reactivity/toref", 
         name: "toref", 
-        meta: { title: "toRef基础用法" }, 
+        meta: { title: "toRef" }, 
         component: () => import("@/views/reactivity/ToRefBase.vue")
       },
       { 
         path: "/reactivity/torefs", 
         name: "torefs", 
-        meta: { title: "toRefs基础用法" }, 
+        meta: { title: "toRefs" }, 
         component: () => import("@/views/reactivity/ToRefsBase.vue")
       },
       { 
         path: "/reactivity/toraw", 
         name: "toraw", 
-        meta: { title: "toRaw基础用法" }, 
+        meta: { title: "toRaw" }, 
         component: () => import("@/views/reactivity/ToRawBase.vue")
       }
     ]
   },
+  { 
+    path: "/computed", 
+    name: "computed", 
+    meta: { title: "计算属性" }, 
+    redirect: "/computed/base",
+    children: [
+      { 
+        path: "/computed/base", 
+        name: "computedBase", 
+        meta: { title: "computed示例" }, 
+        component: () => import("@/views/computed/ComputedBase.vue")
+      },
+      { 
+        path: "/computed/advan", 
+        name: "computedAdvan", 
+        meta: { title: "computed双向绑定" }, 
+        component: () => import("@/views/computed/ComputedAdvan.vue")
+      },
+    ]
+  },
+  { 
+    path: "/watch", 
+    name: "watch", 
+    meta: { title: "侦听器" }, 
+    redirect: "/watch/base",
+    children: [
+      { 
+        path: "/watch/base", 
+        name: "watchBase", 
+        meta: { title: "watch示例" }, 
+        component: () => import("@/views/watch/WatchBase.vue")
+      },
+      { 
+        path: "/watch/reactive", 
+        name: "watchReactive", 
+        meta: { title: "watch侦听响应式对象" }, 
+        component: () => import("@/views/watch/WatchReactive.vue")
+      },
+      { 
+        path: "/watch/effectbase", 
+        name: "effectBase", 
+        meta: { title: "watchEffect示例" }, 
+        component: () => import("@/views/watch/WatchEffectBase.vue")
+      },
+      { 
+        path: "/watch/effectinvalidate", 
+        name: "effectInvalidate", 
+        meta: { title: "watchEffect清除副作用函数" }, 
+        component: () => import("@/views/watch/WatchEffectInvalidate.vue")
+      },
+      { 
+        path: "/watch/callback",
+        name: "watchCallback", 
+        meta: { title: "watch回调的触发时机" }, 
+        component: () => import("@/views/watch/WatchCallback.vue")
+      },
+      { 
+        path: "/watch/stop", 
+        name: "watchStop", 
+        meta: { title: "watch停止侦听器" }, 
+        component: () => import("@/views/watch/WatchStop.vue")
+      },
+    ]
+  },
 ];
 
 export default routes;