watch:{
                   $route(to,from){
                    console.log(from.path);//从哪来
                    console.log(to.path);//到哪去
            //界面变化了就发请求
               }
            },

watch:{
            $route:{
                immediate:true,
                 handler(newValue,oldValue){
                        console.log("详情页---newV:",newValue);
                         console.log("详情页---oldV:",oldValue);
                      }
               },
        },

{
    path: '/address',
    name: 'Address',
    component: () => import('../views/address.vue'),
    meta:{
       title: "标题",
       icon: "图标",
       needLogin:true
    }
  },

// 全局守卫
router.beforeEach((to,from,next)=>{
  // 判断路由是否需要守卫
  //meta数据的方式
  if(to.meta.needLogin){
    // 是否登录
    if(localStorage.token){
      next()
    }else{
      next("/login?redirect="+to.fullPath)
    }
  }else{
    //不需要守卫,直接放行
    next()
  }
})
export default router

router.beforeEach((to, from) => {
  if (to.meta.needLogin) {//说明当前路由需要登录之后才可进入
    if (!localStorage.token) {//还没登录 不为空 就行 简单的判断
      // return "/login?redirect=" + to.name; 
      return "/login?redirect=" + to.fullPath;
    }
  }
})

this.$router.push({ name: this.$route.query.redirect});

this.$router.replace(this.$route.query.to);

loginBtn() {
      this.isdisabled = true;
      setTimeout(() => {
        alert("登录成功");
        this.isdisabled = false;
        localStorage.token = "yzs假冒token";
        // 登录成功之后 回到被拦截的页面
       this.$router.replace(this.$route.query.redirect);
        }
      }, 3000);
    },

query:{redirect:"/two"} ,
        params: { toRouterName: to.name }})

this.$router.push({ name: this.$route.params.toRouterName });

{
    path: '/cart',
    name: 'Cart',
    component: () => import("@/views/cart.vue"),
    meta: {
      title: "标题",
      icon: "图标",
      needLogin: true
    },
    //************* */ 单个的路由守卫
    beforeEnter(to, from, next) {
      //  判断当前是否登录
      if (localStorage.token) {
        next()
      } else {
        next({ name: "Three",
        query:{to:"/cart"} ,
        params: { toRouterName: to.name },})
      }
    }
  },

beforeRouteEnter(to, from, next) {
    // 当前是否登录
    if (localStorage.token) {
      next();
    } else {
      next({ name: "Login", params: { toRouterName: to.name } });
    }
  },

const Foo = {
  template: `...`,
  beforeRouteEnter(to, from, next) {
    // 在渲染该组件的对应路由被 confirm 前调用
    // 不！能！获取组件实例 `this`
    // 因为当守卫执行前，组件实例还没被创建
  },
  beforeRouteUpdate(to, from, next) {
    // 在当前路由改变，但是该组件被复用时调用
    // 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候，
    // 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
    // 可以访问组件实例 `this`
  },
  beforeRouteLeave(to, from, next) {
    // 导航离开该组件的对应路由时调用
    // 可以访问组件实例 `this`
  }
}

beforeRouteEnter (to, from, next) {
  next(vm => {
    // 通过 `vm` 访问组件实例
  })
}