对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实现瀑布流效果(循环渐近)
Jan 27 Javascript
js ajaxfileupload.js上传报错的解决方法
May 05 Javascript
用Angular实时获取本地Localstorage数据,实现一个模拟后台数据登入的效果
Nov 09 Javascript
js通过keyCode值判断单击键盘上某个键,然后触发指定的事件方法
Feb 19 Javascript
JQuery实现定时刷新功能代码
May 09 jQuery
JS简单实现滑动加载数据的方法示例
Oct 18 Javascript
详解Vue用自定义指令完成一个下拉菜单(select组件)
Oct 31 Javascript
Vue官网todoMVC示例代码
Jan 29 Javascript
p5.js入门教程和基本形状绘制
Mar 15 Javascript
vue 监听屏幕高度的实例
Sep 05 Javascript
puppeteer实现html截图的示例代码
Jan 10 Javascript
详解基于React.js和Node.js的SSR实现方案
Mar 21 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源码之 ext/mysql扩展部分
2009/07/17 PHP
php 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
php生成过去100年下拉列表的方法
2015/07/20 PHP
PHP的几个常用加密函数
2016/02/03 PHP
PHP获取文件扩展名的方法实例总结
2017/06/10 PHP
php-beanstalkd消息队列类实例分享
2017/07/19 PHP
在Yii2特定页面如何禁用调试工具栏Debug Toolbar详解
2017/08/07 PHP
聊聊 PHP 8 新特性 Attributes
2020/08/19 PHP
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
JS中的public和private对象,即static修饰符
2012/01/18 Javascript
不使用jquery实现js打字效果示例分享
2014/01/19 Javascript
js动态控制table的tr、td增加及删除的具体实现
2014/04/30 Javascript
BootStrap 智能表单实战系列(十)自动完成组件的支持
2016/06/13 Javascript
实现easyui的datagrid导出为excel的示例代码
2016/11/10 Javascript
原生js实现放大镜特效
2017/03/08 Javascript
原生JS京东轮播图代码
2017/03/22 Javascript
使用JavaScript实现点击循环切换图片效果
2017/09/03 Javascript
vue中选项卡点击切换且能滑动切换功能的实现代码
2018/11/25 Javascript
vue语法自动转typescript(解放双手)
2019/09/18 Javascript
electron 安装,调试,打包的具体使用
2019/11/06 Javascript
[07:55]2014DOTA2 TI正赛第三日 VG上演推进荣耀DKEG告别
2014/07/21 DOTA
zbar解码二维码和条形码示例
2014/02/07 Python
Python中动态创建类实例的方法
2017/03/24 Python
python3下使用cv2.imwrite存储带有中文路径图片的方法
2018/05/10 Python
Python从ZabbixAPI获取信息及实现Zabbix-API 监控的方法
2018/09/17 Python
Scrapy框架爬取西刺代理网免费高匿代理的实现代码
2019/02/22 Python
pytorch 图像中的数据预处理和批标准化实例
2020/01/15 Python
使用python客户端访问impala的操作方式
2020/03/28 Python
送给程序员的20个Java集合面试问题
2014/08/06 面试题
个人求职信范文分享
2014/01/06 职场文书
应届生求职自荐信范文
2014/04/07 职场文书
股东合作协议书
2014/04/14 职场文书
爱护公共设施的标语
2014/06/24 职场文书
计划生育证明格式及范本
2014/10/09 职场文书
2014年初级职称工作总结
2014/12/08 职场文书
java.util.NoSuchElementException原因及两种解决方法
2022/06/28 Java/Android