Vue 路由守卫及其在实际开发中的应用

界面中可以通过三种方式植入路由：全局, 单个路由独享, 组件级。

• 全局前置守卫：首先需要注册全局路由

import router from "./router";
router.beforeEach((to, from, next) => {
   
  // ...
});
new Vue({
   
  el: "#app",
  store,
  router,
  components: {
    App },
  template: "<App/>"
});

应用场景：栗子，验证用户登录过期

router.beforeEach((to, from, next) => {
   
  if (to.matched.some(m => m.meta.auth)) {
   
    // 对路由进行验证
    if (isLogin("isLogin") === "1") {
   
      // 根据后台返回值判断是否登录过期
      // 已经登陆
      next()