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;