main.js

import router from './router'

new Vue({
  el: '#admin',
  router,
  store,
  render: h => h(App)
})

router.js

import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
/* Layout */
import Layout from '@/components/vue/layout'
export const constantRoutes = [
  //主要页面
  {
    path: '/',
    redirect: '/dashboard',
  },
  {
    path: '/login',
    name: '登录',
    component: () => import('@/views/login/index'),
    meta: {
      title: '美丽乡村-登录',
      icon: 'dashboard',

    }, //meta是路由元信息 用来获取路由记录的meta字段
    props: '', //boolean | string | Function; 路由组件传递参数
    alias: '', //string | Array<string>; 路由别名
    beforeEnter: (to, from, next) => {
      next()
    },

    hidden: true,
    caseSensitive: false, // 匹配规则是否大小写敏感(默认值：false)
  },
  {
    path: '/dashboard',
    component: Layout,
    // components:{},//命名视图,需要<router-view class="" name="b"></router-view> 配置
    children: [{
      path: 'index',
      component: () => import('@/views/dashboard/index'),
      name: 'Dashboard',
      meta: {
        title: '主页',
        icon: 'dashboard',
        noCache: true,
        affix: true //当在声明路由是 添加了 Affix 属性，则当前tag会被固定在 tags-view中（不可被删除）
      }
    }, ]
  },

]



const createRouter = () => new VueRouter({
  mode: 'hash', //使用 URL hash 值来作路由。支持所有浏览器，包括不支持 HTML5 History Api 的浏览器。http://www.xxx.com/#/user/id;
  // mode: 'history', // 依赖 HTML5 History API 和服务器配置;利用h5 history.pushState API 来完成 URL 跳转而无须重新加载页面;http://www.xxx.com/user/id;
  scrollBehavior: () => ({
    y: 0
  }),
  routes: constantRoutes,
  linkActiveClass: 'is-active', //<router-link>被激活的时候就会被加上is-active这个class,默认值"router-link-active"
  linkExactActiveClass: 'is-exact-active',
  base: '/', //应用的基路径。例如，如果整个单页应用服务在 /app/ 下，然后 base 就应该设为 "/app/"。对应最上方的{  path: '/',  redirect: '/dashboard', },
  // parseQuery / stringifyQuery:()=>{} //提供自定义查询字符串的解析/反解析函数。覆盖默认行为。
  // fallback:   //当浏览器不支持 history.pushState 控制路由是否应该回退到 hash 模式。默认值为 true。注意iE9不支持history.pushState，不回退的话，会使得每个 router-link 导航都触发整页刷新
})

const router = createRouter()

// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher
}

export default router