全局路由守卫beforeEach在项目中的使用

前置路由守卫代码写在main.js中代码如下：

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import Vant from 'vant'
import 'vant/lib/index.css'
import 'lib-flexible'
import axios from "axios";
import store from "@/store";
Vue.prototype.$http = axios;
Vue.use(Vant);
Vue.config.productionTip = false;


//路由守卫代码
router.beforeEach((to, from, next) => {
  const token = localStorage.getItem('Token');  // 获取token
  if (token) {     // 如果token不为null 就放行，如果为空 就不放行 
    next();
  } else {
    if (to.path === '/login') {  // 在为空的情况下，我们路由跳转的是'/login' 就放行。'/login'代表我们登录页
      next()
    } else {           // 在为空的情况下，访问的不是'/login'， 就直接跳转到'/login'
      next({
        path: '/login'
      })
    }
  }
});


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