vue-router使用beforeEach钩子获取vuex里的state值---正确的方法

搜了很多,看到都是直接在router文件里直接引入store文件,实际我试了下还是有bug——state不同步,commit之后还是原来的值

import store from '@/store/index'
const isLogin=store.state.isLogin;
....
router.beforeEach((to,from,next)=>{
  console.log(isLogin);//在vue页面里调用commit方法修改后,router里获取的还是原始的值,并没有改变
  if(to.name==='Login' || isLogin){
    next();
  }else{
    next({name:'Login'})
  }
})

实际上直接调用routers实例的属性即可同步vue实例的store

router.beforeEach((to,from,next)=>{
  const isLogin=router.app.$options.store.state.isLogin;
  if(to.name==='Login' || isLogin){
    next();
  }else{
    next({name:'Login'})
  }
  
})
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐