您好,登錄后才能下訂單哦!
在Vue2.0中的路由鉤子主要是用來攔截導航,讓它完成跳轉或前取消,可以理解為路由守衛。
分為全局導航鉤子,單個路由獨享的鉤子,組件內鉤子。
三種 類型的鉤子只是用的地方不一樣,都接受一個函數作為參數,函數傳入三個參數,分別為to,from,next。
其中next有三個方法
(1)next(); //默認路由
(2)next(false); //阻止路由跳轉
(3)next({path:'/'}); //阻止默認路由,跳轉到指定路徑
這里我使用了組件內鉤子進行判斷token過期后跳轉到登錄頁,其他兩種鉤子可以去官網查看。
//路由前驗證 beforeRouteEnter(to, from, next) { let postdata = { meta: { client_version: "1.0", client_type: "1", }, data: { access_token: $.cookie("authtoken").toString() } } $.ajax({ url: urls.serchuser, type: 'POST', data: JSON.stringify(postdata) }).done(data => { data = JSON.parse(data); console.log(data); if(data.status == 10050) { next(false); location.href = 'login.html'; }else{ next(); } }) }
實現方法很簡單,在路由前向服務器發送請求,如果返回的數據表明token過期則阻止默認跳轉,否則就正常跳轉。
以上這篇Vue利用路由鉤子token過期后跳轉到登錄頁的實例就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持億速云。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。