14. 基於Vue+Element+nodeJs+Express+MySql後臺管理系統-路由管理

在main.js同級目錄下創建router.js文件用來管理路由：
我這裏的路由採用的是history模式：

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

const originalPush = Router.prototype.push
Router.prototype.push = function push (location) {
  return originalPush.call(this, location).catch(err => err)
}

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/',
      name: 'login',
      component: () => import('./views/Login.vue'),
      meta: { pagePath: '/' }
    },
    {
      path: '/home',
      name: 'home',
      component: () => import(/* webpackChunkName: "home" */ './views/Home.vue'),
      meta: { pagePath: '/home' },
      children: [
        {
          path: 'user',
          name: 'user',
          component: () => import(/* webpackChunkName: "user" */ './views/User/User.vue'),
          meta: { pagePath: '/home/user' }
        },
        {
          path: 'weekly',
          name: 'weekly',
          component: () => import(/* webpackChunkName: "weekly" */ './views/Weekly/Weekly.vue'),
          meta: { pagePath: '/home/weekly' }
        },
        {
          path: 'weeklyadd',
          name: 'weeklyadd',
          component: () => import(/* webpackChunkName: "weekly" */ './views/Weekly/childViews/WeeklyAdd.vue'),
          meta: { pagePath: '/home/weekly' }
        },
        {
          path: 'weeklyedit',
          name: 'weeklyedit',
          component: () => import(/* webpackChunkName: "weekly" */ './views/Weekly/childViews/WeeklyEdit.vue'),
          meta: { pagePath: '/home/weekly' }
        },
        {
          path: 'weeklydetail',
          name: 'weeklydetail',
          component: () => import(/* webpackChunkName: "weekly" */ './views/Weekly/childViews/WeeklyDetail.vue'),
          meta: { pagePath: '/home/weekly' }
        }
      ]
    },
    {
      path: '/refresh',
      component: () => import(/* webpackChunkName: "home" */ './views/Refresh.vue'),
      name: 'Refresh'
    }
  ]
})

項目體驗鏈接

週報管理系統體驗鏈接： https://www.17sucai.com/pins/35488.html

本人前端程序員，長期混跡於各種前端開發中，現在專門爲前端熱愛者建了個微信羣，和大家一起分享自己在工作、學習中遇到的技術知識或問題，還有各種資料和課程，各位感興趣的可以加入哦~