使用vue-router切换页面时,获取上一页url以及当前页面url的方法


Posted in Javascript onMay 06, 2019

今天在实现一个小功能的时候,遇到一个问题,使用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-router切换页面时,获取上一页url以及当前页面url的方法

以上所述是小编给大家介绍的使用vue-router切换页面时,获取上一页url以及当前页面url的方法详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 进阶篇1 正则表达式,cookie管理,userData
Mar 14 Javascript
jQuery使用attr()方法同时设置多个属性值用法实例
Mar 26 Javascript
jQuery使用cookie与json简单实现购物车功能
Apr 15 Javascript
vue 1.x 交互实现仿百度下拉列表示例
Oct 21 Javascript
基于angular-utils-ui-breadcrumbs使用心得(分享)
Nov 03 Javascript
基于模板引擎Jade的应用(详解)
Dec 12 Javascript
ReactNative实现Toast的示例
Dec 31 Javascript
jQuery 防止相同的事件快速重复触发方法
Feb 08 jQuery
如何编写一个d.ts文件的步骤详解
Apr 13 Javascript
vue项目中使用vue-i18n报错的解决方法
Jan 13 Javascript
在vue中动态修改css其中一个属性值操作
Dec 07 Vue.js
详解Vue router路由
Nov 20 Vue.js
vue路由跳转传参数的方法
May 06 #Javascript
如何获取vue单文件自身源码路径
May 06 #Javascript
详解vue-cli中使用rem,vue自适应
May 06 #Javascript
用Vue编写抽象组件的方法
May 06 #Javascript
JS解惑之Object中的key是有序的么
May 06 #Javascript
微信小程序和百度的语音识别接口详解
May 06 #Javascript
微信小程序生成海报分享朋友圈的实现方法
May 06 #Javascript
You might like
全国FM电台频率大全 - 3 河北省
2020/03/11 无线电
PHP SFTP实现上传下载功能
2017/07/26 PHP
php反射学习之不用new方法实例化类操作示例
2019/06/14 PHP
PHP执行系统命令函数实例讲解
2021/03/03 PHP
如何判断鼠标是否在DIV的区域内
2013/11/13 Javascript
JavaScript极简入门教程(一):基础篇
2014/10/25 Javascript
JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解
2015/08/06 Javascript
JavaScript数组实现数据结构中的队列与堆栈
2016/05/26 Javascript
Nginx 配置多站点vhost 的方法
2018/01/07 Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
2018/02/23 Javascript
vuex 项目结构目录及一些简单配置介绍
2018/04/08 Javascript
基于vue-ssr的静态网站生成器VuePress 初体验
2018/04/17 Javascript
JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能分析
2019/03/06 Javascript
[03:04]DOTA2英雄基础教程 影魔
2013/12/11 DOTA
[04:22]DSPL第二期精彩集锦:残血反杀!
2014/12/10 DOTA
[03:24]CDEC.Y赛前采访 努力备战2016国际邀请赛中国区预选赛
2016/06/25 DOTA
python下paramiko模块实现ssh连接登录Linux服务器
2015/06/03 Python
解决PyCharm控制台输出乱码的问题
2019/01/16 Python
Python实现账号密码输错三次即锁定功能简单示例
2019/03/29 Python
计算机二级python学习教程(1) 教大家如何学习python
2019/05/16 Python
python利用多种方式来统计词频(单词个数)
2019/05/27 Python
python 实现返回一个列表中出现次数最多的元素方法
2019/06/11 Python
python判断无向图环是否存在的示例
2019/11/22 Python
Python3.x+pyqtgraph实现数据可视化教程
2020/03/14 Python
python函数调用,循环,列表复制实例
2020/05/03 Python
施华洛世奇澳大利亚官网:SWAROVSKI澳大利亚
2017/01/06 全球购物
美国首屈一指的高品质珠宝设计师和零售商:Allurez
2018/01/23 全球购物
Discard Protocol抛弃协议的作用是什么
2015/10/10 面试题
2014年机关植树节活动方案
2014/02/27 职场文书
村党支部换届选举方案
2014/05/02 职场文书
爱牙日活动总结
2014/08/29 职场文书
民间借贷协议书范本
2014/10/01 职场文书
幼儿园见习报告
2014/10/30 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
2015年材料员工作总结
2015/04/30 职场文书
2016暑期社会实践心得体会范文
2016/01/14 职场文书