对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 相关文章推荐
Prototype1.6 JS 官方下载地址
Nov 30 Javascript
一个支付页面DEMO附截图
Jul 22 Javascript
在JavaScript的AngularJS库中进行单元测试的方法
Jun 23 Javascript
JavaScript实现cookie的写入、读取、删除功能
Nov 05 Javascript
vue2.0全局组件之pdf详解
Jun 26 Javascript
JS SetInterval 代码实现页面轮询
Aug 11 Javascript
JS基于正则表达式实现的密码强度验证功能示例
Sep 21 Javascript
ES6 系列之 WeakMap的使用示例
Aug 06 Javascript
js监听html页面的上下滚动事件方法
Sep 11 Javascript
微信小程序 搜索框组件代码实例
Sep 06 Javascript
node.js中 redis 的安装和基本操作示例
Feb 10 Javascript
vue中提示$index is not defined错误的解决方式
Sep 02 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/06/05 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
PHP执行linux命令6个函数代码实例
2020/11/24 PHP
jquery.cookie.js 操作cookie实现记住密码功能的实现代码
2011/04/27 Javascript
JavaScript 匿名函数(anonymous function)与闭包(closure)
2011/10/04 Javascript
浅析document.ready和window.onload的区别讲解
2013/12/18 Javascript
javascript里绝对用的上的字符分割函数总结
2014/07/31 Javascript
JS模拟键盘打字效果的方法
2015/08/05 Javascript
jQuery动态添加与删除tr行实例代码
2016/10/18 Javascript
BootStrap轻松实现微信页面开发代码分享
2016/10/21 Javascript
EasyUI折叠表格层次显示detailview详解及实例
2016/12/28 Javascript
JS实现图片放大缩小的方法
2017/02/15 Javascript
详解Windows下安装Nodejs步骤
2017/05/18 NodeJs
tween.js缓动补间动画算法示例
2018/02/13 Javascript
js实现各浏览器全屏代码实例
2018/07/03 Javascript
解决angularjs WdatePicker ng-model的问题
2018/09/13 Javascript
[52:29]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第三局
2016/03/03 DOTA
Python开发编码规范
2006/09/08 Python
解决python写的windows服务不能启动的问题
2014/04/15 Python
Python实现发送email的几种常用方法
2014/08/18 Python
Python中为feedparser设置超时时间避免堵塞
2014/09/28 Python
python3将变量写入SQL语句的实现方式
2020/03/02 Python
matplotlib 对坐标的控制,加图例注释的操作
2020/04/17 Python
Pycharm Available Package无法显示/安装包的问题Error Loading Package List解决
2020/09/18 Python
以设计师精品品质提供快速时尚:Mostata
2019/05/10 全球购物
生产车间实习自我鉴定
2013/09/23 职场文书
打架检讨书50字
2014/01/11 职场文书
倡议书格式范文
2014/04/14 职场文书
小学生五年级大队长竞选发言稿
2014/09/12 职场文书
县委党的群众路线教育实践活动工作情况报告
2014/10/25 职场文书
给老师的感谢信
2015/01/20 职场文书
车队安全员岗位职责
2015/02/15 职场文书
恰同学少年观后感
2015/06/08 职场文书
vue如何批量引入组件、注册和使用详解
2021/05/12 Vue.js
css常用字体属性与背景属性介绍
2022/02/28 HTML / CSS
oracle设置密码复杂度及设置超时退出的功能
2022/06/28 Oracle