对vue2.0中.vue文件页面跳转之.$router.push的用法详解


Posted in Javascript onAugust 24, 2018

vue2.0在使用的过程中, .vue文件之间的跳转,在template中的常见写法是:

<router-link to="/miniCard/statement/horizon">
  <button class="btn btn-default colorDe">继续</button>
</router-link>

对vue2.0中.vue文件页面跳转之.$router.push的用法详解

但是有时的需求是页面不直接跳转,有确认弹框或者其他事件,此时就需要在js中设置跳转,常用的一种方法是 .$router.push ,用法如下:

this.$router.push({path: '/...'});

对vue2.0中.vue文件页面跳转之.$router.push的用法详解

希望本文对您有所帮助!

拓展知识:解决this.$router.push无法在新窗口打开的问题

如下所示:

let routeData = this.$router.resolve({ path: '/reportpreview', query: { id: id } });
 window.open(routeData.href, '_blank');

以上这篇对vue2.0中.vue文件页面跳转之.$router.push的用法详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript Date对象使用总结
May 14 Javascript
JS控件的生命周期介绍
Oct 22 Javascript
用JavaScript获取页面文档内容的实现代码
Jun 10 Javascript
JS随机打乱数组的方法小结
Jun 22 Javascript
用file标签实现多图文件上传预览
Feb 14 Javascript
简单实现jQuery上传图片显示预览功能
Jun 29 jQuery
浅谈vue-cli加载不到dev-server.js的解决办法
Nov 24 Javascript
6行代码实现微信小程序页面返回顶部效果
Dec 28 Javascript
JS实现的tab切换并显示相应内容模块功能示例
Aug 03 Javascript
js回调函数仿360开机
Dec 26 Javascript
通过javascript实现扫雷游戏代码实例
Feb 09 Javascript
VUE页面中通过双击实现复制表格中内容的示例代码
Jun 11 Javascript
微信小程序Getuserinfo解决方案图解
Aug 24 #Javascript
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
Aug 24 #Javascript
JavaScript中join()、splice()、slice()和split()函数用法示例
Aug 24 #Javascript
vue 中引用gojs绘制E-R图的方法示例
Aug 24 #Javascript
解决webpack dev-server不能匹配post请求的问题
Aug 24 #Javascript
vue2中,根据list的id进入对应的详情页并修改title方法
Aug 24 #Javascript
Nuxt.js实现校验访问浏览器类型的中间件
Aug 24 #Javascript
You might like
PHP容易忘记的知识点分享
2013/04/30 PHP
PHP使用CURL_MULTI实现多线程采集的例子
2014/07/29 PHP
JScript 脚本实现文件下载 一般用于下载木马
2009/10/29 Javascript
淘宝搜索框效果实现分析
2011/03/05 Javascript
拉动滚动条加载数据的jquery代码
2012/05/03 Javascript
将list转换为json失败的原因
2013/12/17 Javascript
jQuery取id有.的值的方法
2014/05/21 Javascript
用js闭包的方法实现多点标注冒泡示例
2014/05/29 Javascript
JavaScript中数据结构与算法(五):经典KMP算法
2015/06/19 Javascript
js下拉选择框与输入框联动实现添加选中值到输入框的方法
2015/08/17 Javascript
微信小程序 input输入框详解及简单实例
2017/01/10 Javascript
细说webpack源码之compile流程-rules参数处理技巧(1)
2017/12/26 Javascript
Vue.js实现可编辑的表格
2019/12/11 Javascript
angular8.5集成TinyMce5的使用和详细配置(推荐)
2020/11/16 Javascript
Java 生成随机字符的示例代码
2021/01/13 Javascript
关于javascript中的promise的用法和注意事项(推荐)
2021/01/15 Javascript
[01:32]DOTA2 2015国际邀请赛中国区预选赛第四日战报
2015/05/29 DOTA
[55:44]完美世界DOTA2联赛决赛 FTD vs Phoenix 第二场 11.08
2020/11/11 DOTA
python解析xml文件实例分享
2013/12/04 Python
编写Python脚本来实现最简单的FTP下载的教程
2015/05/04 Python
python 实现调用子文件下的模块方法
2018/12/07 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
Python设置matplotlib.plot的坐标轴刻度间隔以及刻度范围
2019/06/25 Python
Python实用工具FuckIt.py介绍
2019/07/02 Python
python 使用matplotlib 实现从文件中读取x,y坐标的可视化方法
2019/07/04 Python
20行Python代码实现一款永久免费PDF编辑工具的实现
2020/08/27 Python
关于Python 解决Python3.9 pandas.read_excel(‘xxx.xlsx‘)报错的问题
2020/11/28 Python
使用CSS3的背景渐变Text Gradient 创建文字颜色渐变
2014/08/19 HTML / CSS
html5 offlline 缓存使用示例
2013/06/24 HTML / CSS
超市端午节活动方案
2014/01/23 职场文书
怎样写好创业计划书的内容
2014/02/06 职场文书
公司合作协议书范本
2014/04/18 职场文书
公务员年度考核评语
2014/12/31 职场文书
世界气象日活动总结
2015/02/27 职场文书
幽默导游词应该怎么写?
2019/08/26 职场文书
python 破解加密zip文件的密码
2021/04/22 Python