VUE設置控制守衛,未登錄時自動跳轉到登錄頁,登錄後正常訪問頁面

index.js中設置如下內容:


const router = new Router({

  routes: [

    {

      path: '/',

      name: 'HelloWorld',

      component: HelloWorld,

      meta:{requireAuth:true}

    },

    {

      path: '/login',

      name: 'login',

      component: Login

    },

    {

      path: '/index',

      name: 'index',

      component: index,

      meta:{requireAuth:true}

    },

  ]

});


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

 //requireAuth對應上面每個跳轉的 meta:{requireAuth:true},

 //配置上說明訪問該路徑時需要檢測是否登錄狀態

 if(to.meta.requireAuth) {

   //sessionStorage可直接使用,無需引入

   //在登錄頁,點擊登錄按鈕後設置sessionStorage.setItem("key","value")

   //通過sessionStorage.getItem("account")獲取,如果有值則是登錄狀態,無值則爲未登錄,自動跳轉到登錄頁

   if(sessionStorage.getItem("account") == null) {  

      next('/login');      

   }else{     

     next();

    }

 }

 else{

    next();

 }

});



export default router;


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章