对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 相关文章推荐
google 搜索框添加关键字实现代码
Apr 24 Javascript
JavaScript开发人员的10个关键习惯小结
Dec 05 Javascript
JavaScript获取Url里的参数
Dec 18 Javascript
JS显示下拉列表框内全部元素的方法
Mar 31 Javascript
基于jQuery实现仿51job城市选择功能实例代码
Mar 02 Javascript
jquery自定义插件——window的实现【示例代码】
May 06 Javascript
JS判断字符串变量是否含有某个字串的实现方法
Jun 03 Javascript
jQuery实现表格行和列的动态添加与删除方法【测试可用】
Aug 01 Javascript
jQuery设置图片等比例缩小的方法
Apr 29 jQuery
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
Jun 13 jQuery
Node.js实现简单的爬取的示例代码
Jun 25 Javascript
微信小程序实现聊天室
Aug 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
星际争霸任务指南——虫族
2020/03/04 星际争霸
使用Curl进行抓取远程内容时url中文编码问题示例探讨
2013/10/29 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
基于PHP实现短信验证码接口(容联运通讯)
2016/09/06 PHP
jQuery 动画基础教程
2008/12/25 Javascript
学习ExtJS form布局
2009/10/08 Javascript
js有序数组的连接问题
2013/10/01 Javascript
JavaScript通过setTimeout实时显示当前时间的方法
2015/04/16 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
2015/06/01 Javascript
jQuery中 delegate使用的问题
2015/07/03 Javascript
javascript实现仿百度图片的瀑布流加载效果
2016/04/20 Javascript
jQuery实现可展开折叠的导航效果示例
2016/09/12 Javascript
Angular4实现鼠标悬停3d倾斜效果
2017/10/25 Javascript
实现单层json按照key字母顺序排序的示例
2017/12/06 Javascript
浅谈React + Webpack 构建打包优化
2018/01/23 Javascript
vue 权限认证token的实现方法
2018/07/17 Javascript
vue组件(全局,局部,动态加载组件)
2018/09/02 Javascript
详解在微信小程序的JS脚本中使用Promise来优化函数处理
2019/03/06 Javascript
创建nuxt.js项目流程图解
2020/03/13 Javascript
javascript 代码是如何被压缩的示例代码
2020/05/06 Javascript
element-plus一个vue3.xUI框架(element-ui的3.x 版初体验)
2020/12/02 Vue.js
Python基于whois模块简单识别网站域名及所有者的方法
2018/04/23 Python
Python+Pandas 获取数据库并加入DataFrame的实例
2018/07/25 Python
python求解数组中两个字符串的最小距离
2018/09/27 Python
分享Python切分字符串的一个不错方法
2018/12/14 Python
Pytest框架之fixture的详细使用教程
2020/04/07 Python
如何利用python web框架做文件流下载的实现示例
2020/06/02 Python
基于django2.2连oracle11g解决版本冲突的问题
2020/07/02 Python
HTML5 File API改善网页上传功能
2009/08/19 HTML / CSS
您附近的水疗和健康场所:Spafinder(美国)
2019/07/05 全球购物
如果一个类实现了多个接口但是这些接口有相同的方法名将会怎样
2013/06/16 面试题
几个Shell Script面试题
2014/04/18 面试题
消防安全管理制度
2014/02/01 职场文书
房地产营销活动策划方案
2014/09/15 职场文书
第一书记观后感
2015/06/08 职场文书
海上钢琴师的观后感
2015/06/11 职场文书