Vip4.0W/12.vue3/project2/src/router/index.js

import {createRouter,createWebHistory,createWebHashHistory} from 'vue-router';
import Home from '../views/Home.vue';
import List from '../views/List.vue';
import Demo1 from '../views/Demo1.vue';
import Demo2 from '../views/Demo2.vue';
import Demo3 from '../views/Demo3.vue';
/**
 * hash history区别
 * 1.hash:路径中包含# #后的内容不会发送到服务器上
 * 属于浏览器端的行为 不需要服务器配置 路径不是很美观 
 * 参数会携带在#后 参数不是很安全
 * 2.history 路径不包含# 需要后端进行匹配的路由 
 * 需要服务器进行配置 路径较美观
 * 参数可以隐藏 较安全
 */

const router = createRouter({
    // 指定当前路由的模式
    history:createWebHistory(),
    // 定义路由表
    routes:[
        {
            path:'/',
            redirect:'/list'
        },
        {
            path: '/home',
            component: Home,
            name:'wode'
        }, {
            //  /list/demo1
            path: '/list',
            component: List,
            children: [
                {
                    path: 'demo1',
                    component: Demo1
                },
                {
                    path: 'demo2',
                    component: Demo2,
                    name:"nvzhuang"
                },
                {
                    path: 'demo3/:ids/:num',
                    component: Demo3,
                    name:"tongzhuang"
                }
            ]
        }
    ]
})

export default router;