使用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获得地址栏参数的两种方法
Nov 08 Javascript
jquery ajax 检测用户注册时用户名是否存在
Nov 03 Javascript
jQuery ul标签下拉菜单演示代码
Dec 11 Javascript
javascript中的对象创建 实例附注释
Feb 08 Javascript
使用typeof方法判断undefined类型
Sep 09 Javascript
理解javascript模块化
Mar 28 Javascript
jQuery+php实时获取及响应文本框输入内容的方法
May 24 Javascript
JavaScript每天必学之基础知识
Sep 17 Javascript
原生js轮播特效
May 18 Javascript
JavaScript实现公告栏上下滚动效果
Mar 13 Javascript
ReactRouter的实现方法
Jan 25 Javascript
vue-element-admin项目导入和导出的实现
May 21 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
php代码收集表单内容并写入文件的代码
2012/01/29 PHP
php查看当前Session的ID实例
2015/03/16 PHP
Yii实现显示静态页的方法
2016/04/25 PHP
键盘KeyCode值列表汇总
2013/11/26 Javascript
js判断元素是否隐藏的方法
2014/06/09 Javascript
使用Plupload实现直接上传附件至七牛云存储
2014/12/26 Javascript
JS实现的网页倒计时数字时钟效果
2015/03/02 Javascript
jQuery实现简单的日期输入格式化控件
2015/03/12 Javascript
jQuery关键词说明插件cluetip使用指南
2015/04/21 Javascript
javascript搜索框效果实现方法
2015/05/14 Javascript
js实现C#的StringBuilder效果完整实例
2015/12/22 Javascript
JS获取复选框的值,并传递到后台的实现方法
2016/05/30 Javascript
js代码实现下拉菜单【推荐】
2016/12/15 Javascript
有关JS中的0,null,undefined,[],{},'''''''',false之间的关系
2017/02/14 Javascript
JS正则表达式验证中文字符
2017/05/08 Javascript
js实现本地时间同步功能
2017/08/26 Javascript
JS实现简单的选择题测评系统代码思路详解(demo)
2017/09/03 Javascript
JsChart组件使用详解
2018/03/04 Javascript
JS多个表单数据提交下的serialize()应用实例分析
2019/08/27 Javascript
vue实现表单录入小案例
2019/09/27 Javascript
Javascript 关于基本类型和引用类型的个人理解
2019/11/01 Javascript
JS运算符优先级与表达式示例详解
2020/09/04 Javascript
利用Vue实现简易播放器的完整代码
2020/12/30 Vue.js
Python中的CURL PycURL使用例子
2014/06/01 Python
Python异常处理总结
2014/08/15 Python
在Pycharm中对代码进行注释和缩进的方法详解
2019/01/20 Python
keras模型可视化,层可视化及kernel可视化实例
2020/01/24 Python
PurCotton全棉时代官网:100%天然棉花生产的生活护理用品
2016/11/18 全球购物
Liu Jo西班牙官网:意大利服装品牌
2019/09/11 全球购物
华美博弈C/VC工程师笔试试题
2012/07/16 面试题
临床医学专业学生的自我评价分享
2013/11/21 职场文书
初中家长评语和期望
2014/12/26 职场文书
华清池导游词
2015/02/02 职场文书
简历自我评价优缺点
2015/03/11 职场文书
学校教师培训工作总结
2015/10/14 职场文书
2016年教代会开幕词
2016/03/04 职场文书