简述vue路由打开一个新的窗口的方法


Posted in Javascript onNovember 29, 2018

简单说一下vue路由如何打开一个新的窗口

1.router-link标签

在vue的官方文档中

简述vue路由打开一个新的窗口的方法

看到这大家应该会想,既然router-link不支持target="_blank"属性,那我们该怎么用router-link打开一个新的窗口呢?别急,继续往下看~

文档中还有一处描述

简述vue路由打开一个新的窗口的方法

router-link添加tag="li"属性后,居然可以变成li标签渲染出来,真特么神奇哈,那可不可以写成tag="a",从而去替代a标签呢?我们尝试着写一哈

<router-link tag="a" target="_blank" to="/about">新品</router-link>

2.编程导航

简述vue路由打开一个新的窗口的方法

上图是官网的最新说法,vue2.0以后router.go和router.push就不支持新窗口打开的属性了,现在用一种新的方式router.resolve

let routeData = this.$router.resolve({
 path: "/about",
 query: {
 name:'lei',
 age: 18,
 phoneNum:12345678901 
 }
});
window.open(routeData.href, '_blank');

总结

以上所述是小编给大家介绍的vue路由打开一个新的窗口的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript 中介者模式实例
Dec 16 Javascript
js实现点击后将文字或图片复制到剪贴板的方法
Aug 04 Javascript
JavaScript中实现单体模式分享
Jan 29 Javascript
js实现绿白相间竖向网页百叶窗动画切换效果
Mar 02 Javascript
js实现在网页上简单显示时间的方法
Mar 02 Javascript
探索angularjs+requirejs全面实现按需加载的套路
Feb 26 Javascript
jquery操作ID带有变量的节点实例
Dec 07 Javascript
关于ES6的六个小特性(二)
Feb 20 Javascript
微信小程序实现选项卡功能
Jun 19 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
Feb 27 Javascript
extjs4图表绘制之折线图实现方法分析
Mar 06 Javascript
React列表栏及购物车组件使用详解
Jun 28 Javascript
微信小程序下拉刷新PullDownRefresh的使用方法
Nov 29 #Javascript
浅析Proxy可以优化vue的数据监听机制问题及实现思路
Nov 29 #Javascript
vue实现双向绑定和依赖收集遇到的坑
Nov 29 #Javascript
js中this的指向问题归纳总结
Nov 28 #Javascript
基于vue实现移动端圆形旋钮插件效果
Nov 28 #Javascript
VUE2.0 ElementUI2.0表格el-table自适应高度的实现方法
Nov 28 #Javascript
Vue触发式全局组件构建的方法
Nov 28 #Javascript
You might like
php创建桌面快捷方式实现方法
2015/12/31 PHP
php远程请求CURL实例教程(爬虫、保存登录状态)
2020/12/10 PHP
在IE下获取object(ActiveX)的Param的代码
2009/09/15 Javascript
Javascript中的变量使用说明
2010/05/18 Javascript
jQuery实现的Div窗口震动特效
2014/06/09 Javascript
Js查找字符串中出现次数最多的字符及个数实例解析
2016/09/05 Javascript
浅谈html转义及防止javascript注入攻击的方法
2016/12/04 Javascript
Vue实现自带的过滤器实例
2017/03/09 Javascript
JavaScript实现QQ聊天消息展示和评论提交功能
2017/05/22 Javascript
详解angularJS+Ionic移动端图片上传的解决办法
2017/09/13 Javascript
seajs模块压缩问题与解决方法实例分析
2017/10/10 Javascript
浅谈基于Vue.js的移动组件库cube-ui
2017/12/20 Javascript
jquery+ajaxform+springboot控件实现数据更新功能
2018/01/22 jQuery
js实现弹出框的拖拽效果实例代码详解
2019/04/16 Javascript
js实现单元格拖拽效果
2020/02/10 Javascript
使用Python编写vim插件的简单示例
2015/04/17 Python
Python中请不要再用re.compile了
2019/06/30 Python
Django model select的多种用法详解
2019/07/16 Python
Python OpenCV调用摄像头检测人脸并截图
2020/08/20 Python
python数组循环处理方法
2019/08/26 Python
Python中base64与xml取值结合问题
2019/12/22 Python
基于Python的Jenkins的二次开发操作
2020/05/12 Python
pytorch读取图像数据转成opencv格式实例
2020/06/02 Python
HTML5新特性之语义化标签
2017/10/31 HTML / CSS
New Balance澳大利亚官网:运动鞋和健身服装
2019/02/23 全球购物
意大利在线药房:shop-farmacia.it
2019/03/12 全球购物
写字楼租赁意向书
2014/07/30 职场文书
2014校长四风问题对照检查材料思想汇报
2014/09/16 职场文书
受资助学生感谢信
2015/01/21 职场文书
七一建党节慰问信
2015/02/14 职场文书
党支部对转正的意见
2015/06/02 职场文书
社区宣传标语口号
2015/12/26 职场文书
成功的商业计划书这样写才最靠谱
2019/07/12 职场文书
刚学完怎么用Python实现定时任务,转头就跑去撩妹!
2021/06/05 Python
springcloud之Feign超时问题的解决
2021/06/24 Java/Android
服务器nginx权限被拒绝解决案例
2022/09/23 Servers