使用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 相关文章推荐
基于jquery实现点击左右按钮图片横向滚动
Apr 11 Javascript
jqGrid日期格式的判断示例代码(开始日期与结束日期)
Nov 08 Javascript
学习使用AngularJS文件上传控件
Feb 16 Javascript
详解JavaScript的AngularJS框架中的表达式与指令
Mar 05 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【二】
May 10 Javascript
Javascript 一些需要注意的细节(必看篇)
Jul 08 Javascript
Vue利用路由钩子token过期后跳转到登录页的实例
Oct 26 Javascript
基于angular-utils-ui-breadcrumbs使用心得(分享)
Nov 03 Javascript
微信小程序实现的贪吃蛇游戏【附源码下载】
Jan 03 Javascript
使用webpack打包koa2 框架app
Feb 02 Javascript
JS大坑之19位数的Number型精度丢失问题详解
Apr 22 Javascript
图解javascript作用域链
May 27 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数组相加 array(“a”)+array(“b”)结果还是array(“a”)
2012/09/19 PHP
php利用cookie实现自动登录的方法
2014/12/10 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
jquery异步循环获取功能实现代码
2010/09/19 Javascript
jQuery实现切换字体大小的方法
2015/03/10 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形网络(1)
2015/11/30 Javascript
JS+CSS3模拟溢出滚动效果
2016/08/12 Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
2016/10/28 Javascript
微信小程序 Template详解及简单实例
2017/01/05 Javascript
微信小程序下拉框组件使用方法详解
2018/12/28 Javascript
解决vue 子组件修改父组件传来的props值报错问题
2019/11/09 Javascript
JS实现前端动态分页码代码实例
2020/06/02 Javascript
jquery+ajax实现异步上传文件显示进度条
2020/08/17 jQuery
关于uniApp editor微信滑动问题
2021/01/15 Javascript
Python实现将xml导入至excel
2015/11/20 Python
Python找出list中最常出现元素的方法
2016/06/14 Python
python3音乐播放器简单实现代码
2020/04/20 Python
linux环境下的python安装过程图解(含setuptools)
2017/11/22 Python
python email smtplib模块发送邮件代码实例
2018/04/26 Python
python脚本监控Tomcat服务器的方法
2018/07/06 Python
Tensorflow中的dropout的使用方法
2020/03/13 Python
keras实现theano和tensorflow训练的模型相互转换
2020/06/19 Python
html5实现的便签特效(实战分享)
2013/11/29 HTML / CSS
关于HTML5 Placeholder新标签低版本浏览器下不兼容的问题分析及解决办法
2016/01/27 HTML / CSS
师德演讲稿范文
2014/05/06 职场文书
财务会计专业自荐书
2014/06/30 职场文书
教师学习群众路线心得体会
2014/11/04 职场文书
2014年社团工作总结范文
2014/11/27 职场文书
入党介绍人意见2015
2015/06/01 职场文书
Vue实现动态查询规则生成组件
2021/05/27 Vue.js
Windows下redis下载、redis安装及使用教程
2021/06/02 Redis
Python基于百度API识别并提取图片中文字
2021/06/27 Python
JavaScript 反射学习技巧
2021/10/16 Javascript
MySQL Innodb索引机制详细介绍
2021/11/23 MySQL
豆瓣2021评分最高动画剧集-豆瓣评分最高的动画剧集2021
2022/03/18 日漫
MySQL中优化SQL语句的方法(show status、explain分析服务器状态信息)
2022/04/09 MySQL