1. 在登陸的時候在本地cookie存儲一個isLogin=true，未登錄為false；
2. 在路由頁router.js里面，寫好beforeEach((to, from, next)，根據(jù)to.name來判斷接下來去那個頁面，以及isLogin是否為true；不符合要求的頁面全部跳轉(zhuǎn)到login頁面；

比如：

 if (!isLogin && to.name !==(不需要需要登陸的頁面)){
        next({
            name: 'login',
        })
    }else {
        if (is_login && toName === 'login') {
            next({
                path: '/'
            })
        } else {
            next()
        }
    }

代碼可能有點問題，但意思是這么個意思

詳情可看我的github: 項目地址

router.beforeEach((to, from, next) => {

next(); //前往下一個頁面

})

router.afterEach(transition => {

});

傳送門：https://router.vuejs.org/zh-c...

就寫在main.js里面就可以

文檔說的很詳細(xì)，有疑問私信

參考這篇，路由攔截和http攔截都用了，不一定要用vuex，用bus或者緩存都行

https://www.cnblogs.com/guoxi...

在router.beforeEach里面判斷是否已經(jīng)登錄，沒有登錄則跳轉(zhuǎn)到登錄頁面

貼代碼和注釋

const whiteList=['/login'];//不需要登錄能訪問的path
router.beforeEach((to, from, next) => {
  console.log('beforeEach');
  var userInfo= JSON.parse(sessionStorage.getItem('userInfoStorage'));//獲取緩存看是否登錄過
  if(whiteList.indexOf(to.path)<0){//訪問了需要登錄才能訪問的頁面
    if(userInfo){//登錄過來直接進(jìn)去
      next();
    }else{
      if(to.path=='/login'){
        next();
      }else{
        next('/login');
      }
    }
  }
  else{
    next();
  }
});

const whiteList = ['/login', '/authredirect']// 免登錄白名單

router.beforeEach((to, from, next) => {
  if (cookieGetToken()) { // determine if there has token
    /* has token*/
    if (to.path === '/login') {
      next({ path: '/' })
    }
    next()
  } else {
    /* has no token*/
    if (whiteList.indexOf(to.path) !== -1) { // 在免登錄白名單，直接進(jìn)入
      next()
    } else {
      next('/login') // 否則全部重定向到登錄頁
    }
  }
})

文檔