使用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 相关文章推荐
新浪中用来显示flash的函数
Apr 02 Javascript
解决jquery .ajax 在IE下卡死问题的解决方法
Oct 26 Javascript
jQuery DOM操作小结与实例
Jan 07 Javascript
js改变文章字体大小的实例代码
Nov 27 Javascript
Javascript限制网页只能在微信内置浏览器中访问
Nov 09 Javascript
JS实现仿京东淘宝竖排二级导航
Dec 08 Javascript
Vue自定义指令介绍(2)
Dec 08 Javascript
微信小程序实现滴滴导航tab切换效果
Jul 24 Javascript
vue实现element-ui对话框可拖拽功能
Aug 17 Javascript
Vue使用Clipboard.JS在h5页面中复制内容实例详解
Sep 03 Javascript
vue-axios同时请求多个接口 等所有接口全部加载完成再处理操作
Nov 09 Javascript
vue 使用微信jssdk,调用微信相册上传图片功能
Nov 13 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
PHP中利用substr_replace将指定两位置之间的字符替换为*号
2011/01/27 PHP
无刷新动态加载数据 滚动条加载适合评论等页面
2013/10/16 PHP
php时区转换转换函数
2014/01/07 PHP
php中动态调用函数的方法
2015/03/16 PHP
PHP架构及原理知识点详解
2019/12/22 PHP
document.getElementById方法在Firefox与IE中的区别
2010/05/18 Javascript
aspx中利用js实现确认删除代码
2010/07/22 Javascript
js函数名与form表单元素同名冲突的问题
2014/03/07 Javascript
Javascript连接多个数组不用concat来解决
2014/03/24 Javascript
jquery图形密码实现方法
2015/03/11 Javascript
jQuery实现html元素拖拽
2015/07/21 Javascript
javascript与Python快速排序实例对比
2015/08/10 Javascript
Bootstrap页面布局基础知识全面解析
2016/06/13 Javascript
基于JQuery实现分隔条的功能
2016/06/17 Javascript
jquery实现焦点轮播效果
2017/02/23 Javascript
微信小程序冒泡事件及其阻止方法实例分析
2018/12/06 Javascript
Flask解决跨域的问题示例代码
2018/02/12 Python
为什么入门大数据选择Python而不是Java?
2018/03/07 Python
PyQt5每天必学之拖放事件
2020/08/27 Python
推荐10款最受Python开发者欢迎的Python IDE
2018/09/16 Python
Python 实现两个服务器之间文件的上传方法
2019/02/13 Python
Python3.7 pyodbc完美配置访问access数据库
2019/10/03 Python
Python TestSuite生成测试报告过程解析
2020/07/23 Python
python将字典内容写入json文件的实例代码
2020/08/12 Python
Python使用socket模块实现简单tcp通信
2020/08/18 Python
Python使用eval函数执行动态标表达式过程详解
2020/10/17 Python
使用python画出逻辑斯蒂映射(logistic map)中的分叉图案例
2020/12/11 Python
HTML5实现简单图片上传所遇到的问题及解决办法
2016/01/20 HTML / CSS
Quiksilver荷兰官方网站:冲浪和滑雪板
2019/11/16 全球购物
服务员岗位责任制
2014/02/11 职场文书
整改落实情况汇报材料
2014/10/29 职场文书
学校党的群众路线教育实践活动总结材料
2014/10/30 职场文书
离婚财产分割协议书
2015/08/11 职场文书
学习党章心得体会2016
2016/01/15 职场文书
Python使用psutil库对系统数据进行采集监控的方法
2021/08/23 Python
vue整合百度地图显示指定地点信息
2022/04/06 Vue.js