使用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 相关文章推荐
腾讯UED 漂亮的提示信息效果代码
Sep 12 Javascript
JQuery入门——事件切换之toggle()方法应用介绍
Feb 05 Javascript
JS 实现点击a标签的时候让其背景更换
Oct 15 Javascript
浅谈jQuery中setInterval()方法
Jul 07 Javascript
谈谈AngularJs中的隐藏和显示
Dec 09 Javascript
详解Bootstrap的iCheck插件checkbox和radio
Aug 24 Javascript
简单实现Bootstrap标签页
Aug 09 Javascript
基于vue的短信验证码倒计时demo
Sep 13 Javascript
vue中axios解决跨域问题和拦截器的使用方法
Mar 07 Javascript
详解koa2学习中使用 async 、await、promise解决异步的问题
Nov 13 Javascript
Vue 组件修改根实例的数据的方法
Apr 02 Javascript
微信小程序实现签到弹窗动画
Sep 21 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
Excel数据导入Mysql数据库的实现代码
2008/06/05 PHP
php 5.3.5安装memcache注意事项小结
2011/04/12 PHP
php 定义404页面的实现代码
2012/11/19 PHP
详细讲解JS节点知识
2010/01/31 Javascript
为Extjs加加速(javascript加速)
2010/08/19 Javascript
jQuery源码分析-05异步队列 Deferred 使用介绍
2011/11/14 Javascript
javascript比较语义化版本号的实现代码
2016/09/09 Javascript
JQuery中解决重复动画的方法
2016/10/17 Javascript
javascript鼠标跟随运动3种效果(眼球效果,苹果菜单,方向跟随)
2016/10/27 Javascript
BootStrap模态框不垂直居中的解决方法
2017/10/19 Javascript
Node.js笔记之process模块解读
2018/05/31 Javascript
nodejs使用node-xlsx生成excel的方法示例
2019/08/22 NodeJs
vue中js判断长时间不操作界面自动退出登录(推荐)
2020/01/22 Javascript
javascript设计模式 ? 迭代器模式原理与用法实例分析
2020/04/17 Javascript
javascript实现移动端红包雨页面
2020/06/23 Javascript
vue单元格多列合并的实现
2020/11/26 Vue.js
Python 网络编程起步(Socket发送消息)
2008/09/06 Python
ssh批量登录并执行命令的python实现代码
2012/05/25 Python
使用python开发vim插件及心得分享
2014/11/04 Python
Python下实现的RSA加密/解密及签名/验证功能示例
2017/07/17 Python
Python面向对象类继承和组合实例分析
2018/05/28 Python
Python如何批量获取文件夹的大小并保存
2020/03/31 Python
Python发送邮件封装实现过程详解
2020/05/09 Python
python使用hdfs3模块对hdfs进行操作详解
2020/06/06 Python
python 解决mysql where in 对列表(list,,array)问题
2020/06/06 Python
Python中lru_cache的使用和实现详解
2021/01/25 Python
python多线程爬取西刺代理的示例代码
2021/01/30 Python
蒂芙尼澳大利亚官方网站:Tiffany&Co. Australia
2017/08/27 全球购物
英国户外服装品牌:Craghoppers
2019/04/25 全球购物
俄罗斯购买自行车网站:Vamvelosiped
2021/01/29 全球购物
工作失职检讨书范文
2014/01/16 职场文书
精彩的广告词
2014/03/19 职场文书
公司授权委托书范文
2014/08/02 职场文书
销售经理工作检讨书
2015/02/19 职场文书
jquery插件实现搜索历史
2021/04/24 jQuery
浅谈Python响应式类库RxPy
2021/06/14 Python