路由基础配置：

路由基础配置：

（1）router-index.js

vue的默认配置
import Vue from 'vue'
import VueRouter from 'vue-router'


将需要配置路由的页面给引进来
import LoginIndex from '@/views/Login/'
import LayoutIndex from '@/views/Layout/'
import HomeIndex from '@/views/Home/'
import QaIndex from '@/views/qa/'
import VideoIndex from '@/views/video/'
import MyIndex from '@/views/My/'


注册VueRouter这个插件
Vue.use(VueRouter)


配置路由映射表
const routes = [
  {
    path: '/login',
    name: 'login',
    component: LoginIndex
  },
  {
    path: '/',
    component: LayoutIndex,
    children: [
      {
        path: '',
        name: 'Home',
        component: HomeIndex
      },
      {
        path: '/qa',
        name: 'qa',
        component: QaIndex
      },
      {
        path: '/video',
        name: 'video',
        component: VideoIndex
      },
      {
        path: '/My',
        name: 'My',
        component: MyIndex
      }
    ]
  }

]


路由相关属性
const router = new VueRouter({
  routes,
  activeClass: 'active'
})


导出路由
export default router

（2）main.js中相关代码

import Vue from 'vue'
import App from './App.vue'
// 加载路由模块
import router from './router'

Vue.config.productionTip = false
// 创建vue根实例，将router，store配置到根实例中
new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')