使用vue-router切换页面时，获取上一页url以及当前页面url的方法
更新时间：2019年05月06日 16:05:25 作者：抖音
这篇文章主要介绍了使用vue-router切换页面时，获取上一页url以及当前页面url的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
今天在实现一个小功能的时候，遇到一个问题，使用vue-router获取上一页面的url信息，我尝试了多种方式，发现使用vue-router的canDeactivate钩子实现这个功能最为方便，现在将我的实现代码总结如下:
项目使用的是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的方法详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
最近在使用vue开发的h5移动端想要实现一个调用摄像头扫描二维码的功能,所以下面这篇文章主要给大家介绍了关于Vue移动端实现调用相机扫描二维码或条形码的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-08-08
这篇文章主要为大家详细介绍了vue日期组件,支持vue1.0和2.0，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-01-01
vue-cli脚手架模板是基于node下的npm来完成安装，这篇文章主要介绍了vue-cli脚手架的安装教程图解 ,需要的朋友可以参考下2018-09-09
这篇文章主要介绍了Vue如何使用CSS自定义变量，帮助大家更好的理解和学习使用vue框架，感兴趣的朋友可以了解下2021-05-05
这篇文章主要为大家详细介绍了vue实现目录树结构，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
这篇文章主要介绍了proxy实现vue3数据双向绑定原理,文章以介绍proxy的优点开始展开全文内容，围绕proxy实现vue3数据双向绑定的相关资料，,需要的朋友可以参考一下2021-12-12
在web后台管理项目中,经常要用到dialog,就vue来说,使用方式则是引入组件,注册,在template中使用,试想一下,如果我们需要在项目中的不同.vue文件中使用该dialog,但是又不想每次都在template中写入组件该如何实现呢？本文我们介绍用指令控制dialog,需要的朋友可以参考下2024-07-07
这篇文章主要给大家介绍了关于vue中watch和computed区别的相关资料,computed和watch都是vue框架中的用于监听数据变化的属性,文中通过代码介绍的非常详细,需要的朋友可以参考下2023-11-11
这篇文章主要为大家详细介绍了vue.js中使用mint-ui框架的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
这篇文章主要介绍了vue 本地环境判断方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
最新评论