Vue Router升级版写法

router/index.js

import Index from '../pages/Index'
import Mine from '../pages/Mine'
import More from '../pages/More'
import TrendMap from '../pages/TrendMap'
import Rank from '../pages/Rank'
import AllIndex from '../pages/AllIndex'
import MyMessage from '../pages/MyMessage'
import login from '../pages/login.vue'

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

Vue.use(Router);

export const scmsRoutes = [//scmsRoutes你自己起名字
  {path: '/', redirect: '/login'},
  {path: '/login', name: 'login', component: login},
  {path: '/index', name: 'Index', component: Index,},
  {path: '/mine', name: 'Mine', component: Mine},
  {path: '/more', name: 'More', component: More},
  {path: './TrendMap', name: 'TrendMap', component: TrendMap},
  {path: '/rank', name: 'Rank', component: Rank},
  {path: '/AllIndex', name: 'AllIndex', component: AllIndex},
  {path: '/MyMessage', name: 'MyMessage', component: MyMessage}
];


export default new Router({
  routes:scmsRoutes,//注意这个routes是官方 Vue Router提供的，必须写这个名字，不然页面出不来（已经踩了一次坑了）
  hashbang: true,
  history: true,
  saveScrollPosition: true,
  suppressTransitionError: true,
})

---

接着来到main.js文件里面

import Vue from 'vue'
import router from './router'//注意这个./router的路径说明一下，它是从根路径开始的,找到的是index.js文件
import axios from 'axios'
import VueAxios from 'vue-axios'
import {post} from './api/http.js'
import MuseUI from 'muse-ui'
import 'muse-ui/dist/muse-ui.css' // 加载样式
import Router from 'vue-router'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import $ from 'jquery'




Vue.use(MuseUI);
Vue.use(VueAxios, axios);
Vue.use(Router);
Vue.prototype.$post=post;
Vue.use(ElementUI);


router.beforeEach(function (to, from, next) {//在跳转之前执行
  let toPath = to.path;
  if (toPath === '/Index' || toPath === '/' || toPath === '/Mine')   //判断是否关闭tabbar
    store.commit("setIsIndex", true);
  else
    store.commit("setIsIndex", true);
  next()
});
Vue.prototype.$axios=axios;

new Vue({
  el: '#app',
  router,
  store,
  template: '<App/>',
  components: { App }
})