使用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判断录入的日期是否合法
Jan 08 Javascript
javascript 支持ie和firefox杰奇翻页函数
Jul 22 Javascript
javascript学习(二)javascript常见问题总结
Jan 02 Javascript
js简易namespace管理器 实例代码
Jun 21 Javascript
JavaScript中的原始值和复杂值
Jan 07 Javascript
微信小程序 详解下拉加载与上拉刷新实现方法
Jan 13 Javascript
对类Vue的MVVM前端库的实现代码
Sep 07 Javascript
微信小程序全局变量改变监听的实现方法
Jul 15 Javascript
微信小程序在text文本实现多种字体样式
Nov 08 Javascript
ES6 proxy和reflect的使用方法与应用实例分析
Feb 15 Javascript
react 不用插件实现数字滚动的效果示例
Apr 14 Javascript
JS数组及对象遍历方法代码汇总
Jun 16 Javascript
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
乐信RP2100的电路分析和打磨
2021/03/02 无线电
快速配置PHPMyAdmin方法
2008/06/05 PHP
php页面缓存ob系列函数介绍
2012/10/18 PHP
PHP7 参数处理机制修改
2021/03/09 PHP
解析javascript 实用函数的使用详解
2013/05/10 Javascript
使用javascript为网页增加夜间模式
2014/01/26 Javascript
Javascript前端UI框架Kit使用指南之Kitjs简介
2014/11/28 Javascript
JS+CSS实现精美的二级导航效果代码
2015/09/17 Javascript
Bootstrap教程JS插件弹出框学习笔记分享
2016/05/17 Javascript
老生常谈js中的MVC
2017/07/25 Javascript
ES6 javascript的异步操作实例详解
2017/10/30 Javascript
React Native日期时间选择组件的示例代码
2018/04/27 Javascript
node.js环境搭建图文详解
2018/09/19 Javascript
详解js访问对象的属性和方法
2018/10/25 Javascript
ES6模板字符串和标签模板的应用实例分析
2019/06/25 Javascript
vue 使用vant插件做tabs切换和无限加载功能的实现
2020/11/04 Javascript
如何实现vue的tree组件
2020/12/03 Vue.js
python发布模块的步骤分享
2014/02/21 Python
Python中类的定义、继承及使用对象实例详解
2015/04/30 Python
基于python中staticmethod和classmethod的区别(详解)
2017/10/24 Python
机器学习python实战之手写数字识别
2017/11/01 Python
Python程序员面试题 你必须提前准备!
2018/01/16 Python
python实现冒泡排序算法的两种方法
2018/03/10 Python
Python Grid使用和布局详解
2018/06/30 Python
python线程的几种创建方式详解
2019/08/29 Python
python return逻辑判断表达式实现解析
2019/12/02 Python
Python处理PDF与CDF实例
2020/02/26 Python
python GUI库图形界面开发之PyQt5选项卡控件QTabWidget详细使用方法与实例
2020/03/01 Python
Python中logging日志的四个等级和使用
2020/11/17 Python
20佳惊艳的HTML5应用程序示例分享
2011/05/03 HTML / CSS
大学生求职简历的自我评价
2013/10/14 职场文书
公司端午节活动方案
2014/02/04 职场文书
出纳担保书范文
2014/04/02 职场文书
护理学院专科毕业生求职信
2014/06/28 职场文书
给老婆的检讨书(搞笑版)
2015/05/06 职场文书
windows系统搭建WEB服务器详细教程
2022/08/05 Servers