131 lines
3.5 KiB
TypeScript
131 lines
3.5 KiB
TypeScript
const routes = [
|
|
{
|
|
path: "/",
|
|
name: "app",
|
|
redirect: "/reactivity"
|
|
},
|
|
{
|
|
path: "/reactivity",
|
|
name: "reactivity",
|
|
meta: { title: "响应式基础" },
|
|
redirect: "/reactivity/reactive",
|
|
children: [
|
|
{
|
|
path: "/reactivity/reactive",
|
|
name: "reactive",
|
|
meta: { title: "reactive" },
|
|
component: () => import("@/views/reactivity/ReactiveBase.vue")
|
|
},
|
|
{
|
|
path: "/reactivity/ref",
|
|
name: "ref",
|
|
meta: { title: "ref" },
|
|
component: () => import("@/views/reactivity/RefBase.vue")
|
|
},
|
|
{
|
|
path: "/reactivity/toref",
|
|
name: "toref",
|
|
meta: { title: "toRef" },
|
|
component: () => import("@/views/reactivity/ToRefBase.vue")
|
|
},
|
|
{
|
|
path: "/reactivity/torefs",
|
|
name: "torefs",
|
|
meta: { title: "toRefs" },
|
|
component: () => import("@/views/reactivity/ToRefsBase.vue")
|
|
},
|
|
{
|
|
path: "/reactivity/toraw",
|
|
name: "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")
|
|
}
|
|
]
|
|
},
|
|
{
|
|
path: "/component",
|
|
name: "component",
|
|
meta: { title: "组件" },
|
|
redirect: "/component/global",
|
|
children: [
|
|
{
|
|
path: "/component/global",
|
|
name: "globalComponent",
|
|
meta: { title: "全局组件" },
|
|
component: () => import("@/views/component/GlobalComponent.vue")
|
|
},
|
|
{
|
|
path: "/component/part",
|
|
name: "partComponent",
|
|
meta: { title: "局部组件" },
|
|
component: () => import("@/views/component/PartComponent.vue")
|
|
}
|
|
]
|
|
}
|
|
];
|
|
|
|
export default routes; |