Vue路由:导航守卫

// 1. router.beforeEach() - 在url路径改变, 但是路由页面出现之前, 先被这个方法里的函数体执行一遍
// 如果遇到next() 就正常跳转到你本该去的路由路径, 如果next("路径")-就不跳转到原来的路径了而是去这顶的这个路径查看
let isLogin = false; // 未登录模拟
router.beforeEach((to, from, next) => { 
    // to: 要去到的路由对象的信息
    // from: 从哪个路由跳走的信息
    // next: 本质就是一个方法, 需要调用next才会让路由对应的标签显示到router-view上

    // 里面的key区别:
    // path: 路由路径
    // fullPath: 路由路径+?后面的参数(如果有的话)
    // name: 路由名字
    // query/params: 装载路由的参数和值
    
    // 2. 如果去的不需要验证身份的路由, 则直接放行
    if (to.path != "/shopcar") {
        next();
    } else if (to.path == "/shopcar" && isLogin == true) {
        next(); // 你有登录状态, 可以查看购物车页面
    } else { // 证明你要去购物车页面, 但是登录未通过, 强制滚去登录页面
        next("/login"); // 直接修改路由#/路径
    }
})