You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
49 lines
1.6 KiB
49 lines
1.6 KiB
1 year ago
|
// 引入必要的router组件
|
||
|
|
import {createRouter, createWebHistory} from 'vue-router'
|
||
|
|
// 引入视图
|
||
|
|
const Home = () => import('../views/Home/Home.vue')
|
||
|
|
const UserIndex = () => import('../views/User/UserIndex.vue')
|
||
|
|
|
||
|
|
// 引入组件
|
||
|
|
const change_user = () => import('../components/User/ChangeUser.vue')
|
||
|
|
const user_info = () => import('../components/User/UserInfo.vue')
|
||
|
|
|
||
|
|
// 创建路由，如果同一个路由中包含多个组件，则将component改名为components（加s），已对像的形式加添加多个组件，对象中的key是对象的名称， 可以在视图中使用此名称指定组件
|
||
|
|
const routes = [
|
||
|
|
{
|
||
|
|
path: '/',
|
||
|
|
name: 'home',
|
||
|
|
component: Home
|
||
|
|
},
|
||
|
|
{
|
||
|
|
path: '/user',
|
||
|
|
name: 'user',
|
||
|
|
component: UserIndex,
|
||
|
|
// redirect 设置默认显示的页面
|
||
|
|
redirect: '/user/info',
|
||
|
|
// 定义嵌套路由, 子路径不要加'/'，加了'/' 请求路径是/info，不加的请求是/user/info
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
path: 'info',
|
||
|
|
name: 'info',
|
||
|
|
component: user_info,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
path: 'change',
|
||
|
|
name: 'change',
|
||
|
|
component: change_user,
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
|
||
|
|
// 创建路由器，使用createRouter方法，传入history（路由类型）和 创建好的路由routes
|
||
|
|
// 路由类型分为hash型和html5型，分别为createWebHashHistory和createWebHistory
|
||
|
|
const router = createRouter({
|
||
|
|
history: createWebHistory(),
|
||
|
|
routes
|
||
|
|
})
|
||
|
|
|
||
|
|
// 导出路由
|
||
|
|
export default router
|