使用vue-router切換頁面時,獲取上一頁url以及當前頁面url的方法
更新時間:2019年05月06日 16:05:25 作者:抖音
這篇文章主要介紹了使用vue-router切換頁面時,獲取上一頁url以及當前頁面url的方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
今天在實現(xiàn)一個小功能的時候,遇到一個問題,使用vue-router獲取上一頁面的url信息,我嘗試了多種方式,發(fā)現(xiàn)使用vue-router的canDeactivate鉤子實現(xiàn)這個功能最為方便,現(xiàn)在將我的實現(xiàn)代碼總結如下:
項目使用的是vue-cli,直接貼代碼
export default { mixins: [], vuex: { actions: {fetchCertificates}, }, data() { return {} }, route: { data() { this.$root.showLoading(); return this.fetchCertificates().then((res) => { this.$root.dismissLoading(); if (res.error) return this.$root.toastError(res.error); if(res.data.certificates.length >0){ return res.data; }else{ console.log(this.$route ,"----當前頁面的url信息----"); } }); }, canActivate (transition) { console.log(transition,"======上一個頁面的url信息======="); transition.next(); } }, }
以上所述是小編給大家介紹的使用vue-router切換頁面時,獲取上一頁url以及當前頁面url的方法詳解整合,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關文章
Vue移動端實現(xiàn)調用相機掃描二維碼或條形碼的全過程
最近在使用vue開發(fā)的h5移動端想要實現(xiàn)一個調用攝像頭掃描二維碼的功能,所以下面這篇文章主要給大家介紹了關于Vue移動端實現(xiàn)調用相機掃描二維碼或條形碼的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-08-08proxy實現(xiàn)vue3數(shù)據(jù)雙向綁定原理
這篇文章主要介紹了proxy實現(xiàn)vue3數(shù)據(jù)雙向綁定原理,文章以介紹proxy的優(yōu)點開始展開全文內容,圍繞proxy實現(xiàn)vue3數(shù)據(jù)雙向綁定的相關資料,,需要的朋友可以參考一下2021-12-12