对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 相关文章推荐
基于jquery.Jcrop的头像编辑器
Mar 01 Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
Jun 14 Javascript
JS加jquery简单实现标签元素的显示或隐藏
Sep 23 Javascript
js showModalDialog 弹出对话框的简单实例(子窗体)
Jan 07 Javascript
CSS3,HTML5和jQuery搜索框集锦
Dec 02 Javascript
jQuery的实例及必知重要的jQuery选择器详解
May 20 Javascript
基于js中this和event 的区别(详解)
Oct 24 Javascript
Vue.js与 ASP.NET Core 服务端渲染功能整合
Nov 16 Javascript
vue嵌套路由与404重定向实现方法分析
May 04 Javascript
详解vue-cli下ESlint 配置说明
Sep 03 Javascript
node.js中对Event Loop事件循环的理解与应用实例分析
Feb 14 Javascript
如何修改Vue打包后文件的接口地址配置的方法
Apr 22 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读取MySQL数据代码
2008/06/05 PHP
PHP的时间戳与具体时间转化的简单实现
2016/06/13 PHP
关于php 高并发解决的一点思路
2017/04/16 PHP
Firefox下提示illegal character并出现乱码的原因
2010/03/25 Javascript
动态的改变IFrame的高度实现IFrame自动伸展适应高度
2012/12/28 Javascript
JS图片无缝滚动(简单利于使用)
2013/06/17 Javascript
jquery弹出框的用法示例(2)
2013/08/26 Javascript
JavaScript中Function详解
2015/02/27 Javascript
jQuery插件jFade实现鼠标经过的图片高亮其它变暗
2015/03/14 Javascript
jquery 插件实现瀑布流图片展示实例
2015/04/03 Javascript
Windows系统下使用Sublime搭建nodejs环境
2015/04/13 NodeJs
JavaScript必知必会(三) String .的方法来自何方
2016/06/08 Javascript
Jquery调用iframe父页面中的元素及方法
2016/08/23 Javascript
微信小程序 图片宽高自适应详解
2017/05/11 Javascript
浅谈vue+webpack项目调试方法步骤
2017/09/11 Javascript
Vue.js组件通信的几种姿势
2017/10/23 Javascript
JavaScript实现数值自动增加动画
2017/12/28 Javascript
node内置调试方法总结
2018/02/22 Javascript
对mac下nodejs 更新到最新版本的最新方法(推荐)
2018/05/17 NodeJs
在pycharm中开发vue的方法步骤
2020/03/04 Javascript
利用webpack理解CommonJS和ES Modules的差异区别
2020/06/16 Javascript
js编写简易的计算器
2020/07/29 Javascript
js实现筛选功能
2020/11/24 Javascript
跟老齐学Python之从if开始语句的征程
2014/09/14 Python
Windows下Python使用Pandas模块操作Excel文件的教程
2016/05/31 Python
Python实现读取Properties配置文件的方法
2018/03/29 Python
python操作小程序云数据库实现简单的增删改查功能
2019/06/06 Python
Pandas_cum累积计算和rolling滚动计算的用法详解
2019/07/04 Python
Python3常见函数range()用法详解
2019/12/30 Python
浅析Python打包时包含静态文件处理方法
2021/01/15 Python
英国家庭珠宝商:T. H. Baker
2018/02/08 全球购物
英国一家集合了众多有才华设计师品牌的奢侈店:Wolf & Badger
2018/04/18 全球购物
事业单位辞职信范文
2014/01/19 职场文书
开学寄语大全
2014/04/08 职场文书
4s店活动策划方案
2014/08/25 职场文书
2015大学生党员自我评价范文
2015/03/03 职场文书