简述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 相关文章推荐
jquery tools系列 expose 学习
Sep 06 Javascript
JS 各种网页尺寸判断实例方法
Apr 18 Javascript
文件编码导致jquery失效的解决方法
Jun 26 Javascript
JavaScript地图拖动功能SpryMap的简单实现
Jul 17 Javascript
使用typeof判断function是否存在于上下文
Aug 14 Javascript
JS中获取函数调用链所有参数的方法
May 07 Javascript
用JS写的一个Ajax库(实例代码)
Aug 06 Javascript
值得分享和收藏的xmlplus组件学习教程
May 05 Javascript
详解Angular2响应式表单
Jun 14 Javascript
vue 粒子特效的示例代码
Sep 19 Javascript
vue项目动态设置页面title及是否缓存页面的问题
Nov 08 Javascript
vue安装遇到的5个报错及解决方法
Jun 12 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日历程序
2006/12/06 PHP
Yii使用find findAll查找出指定字段的实现方法
2014/09/05 PHP
php中cookie实现二级域名可访问操作的方法
2014/11/11 PHP
PHP解压ZIP文件到指定文件夹的方法
2016/11/17 PHP
Thinkphp开发--集成极光推送
2017/09/15 PHP
URL编码转换,escape() encodeURI() encodeURIComponent()
2006/12/27 Javascript
JS在IE和FireFox之间常用函数的区别小结
2010/03/12 Javascript
Pro JavaScript Techniques学习笔记
2010/12/28 Javascript
JavaScript计算字符串中每个字符出现次数的小例子
2013/07/02 Javascript
JS去除数组重复值的五种不同方法
2013/09/06 Javascript
JavaScript使用setInterval()函数实现简单轮询操作的方法
2015/02/02 Javascript
JavaScript操作URL的相关内容集锦
2015/10/29 Javascript
JavaScript实现带缓冲效果的随屏滚动漂浮广告代码
2015/11/06 Javascript
学习JavaScript鼠标响应事件
2015/12/25 Javascript
详解JavaScript UTC时间转换方法
2016/01/07 Javascript
canvas 绘制圆形时钟
2017/02/22 Javascript
vue如何实现observer和watcher源码解析
2017/03/09 Javascript
JS实现AES加密并与PHP互通的方法分析
2017/04/19 Javascript
详解express与koa中间件模式对比
2017/08/07 Javascript
详解Angular中通过$location获取地址栏的参数
2018/08/02 Javascript
uniapp与webview之间的相互传值的实现
2020/06/29 Javascript
[26:21]浴火之凤-TI4世界冠军Newbee战队纪录片
2014/08/07 DOTA
python3爬取各类天气信息
2018/02/24 Python
Python获取昨天、今天、明天开始、结束时间戳的方法
2018/06/01 Python
Python实现查找二叉搜索树第k大的节点功能示例
2019/01/24 Python
python实现定时压缩指定文件夹发送邮件
2020/12/22 Python
python为什么要安装到c盘
2020/07/20 Python
Python接收手机短信的代码整理
2020/08/02 Python
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
奥地利汽车配件店:Pkwteile.at
2017/03/10 全球购物
单身旅行者的单身假期:Just You
2018/04/08 全球购物
自主招生自荐信范文
2013/12/04 职场文书
会计专业毕业生自荐书
2014/06/25 职场文书
出生公证书
2015/01/23 职场文书
医生个人年终总结
2015/02/28 职场文书
Sql Server之数据类型详解
2022/02/28 SQL Server