vue-element-admin 路由如何配置

vue-element-admin 是一个基于 Vue.js 和 Element UI 的后台管理系统模板，路由配置主要在 src/router/index.js 文件中进行。具体步骤如下：

1. 引入 Vue 和 Vue Router：

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

2. 引入各个页面组件：

import Layout from '@/layout'
import Dashboard from '@/views/dashboard/index'
import Login from '@/views/login/index'
import NotFound from '@/views/404'

3. 使用 Vue Router：

Vue.use(Router)

4. 配置路由：

export const constantRoutes = [
  {
    path: '/login',
    component: Login,
    hidden: true
  },
  {
    path: '/404',
    component: NotFound,
    hidden: true
  },
  {
    path: '/',
    component: Layout,
    redirect: '/dashboard',
    children: [
      {
        path: 'dashboard',
        component: Dashboard,
        name: 'Dashboard',
        meta: { title: 'Dashboard', icon: 'dashboard' }
      }
    ]
  },
  {
    path: '*',
    redirect: '/404',
    hidden: true
  }
]

5. 创建路由实例：

const createRouter = () => new Router({
  mode: 'history', // require service support
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

6. 导出路由实例：

const router = createRouter()

export default router

7. 在 main.js 中引入路由实例并挂载到 Vue 实例上：

import router from './router'

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')