简述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(笔记)
Oct 06 Javascript
javascript如何动态加载表格与动态添加表格行
Nov 27 Javascript
javascript 密码框防止用户粘贴和复制的实现代码
Feb 17 Javascript
鼠标移到图片上变大显示而不是放大镜效果
Jun 15 Javascript
超级好用的jQuery圆角插件 Corner速成
Aug 31 Javascript
vue.js学习笔记之绑定style样式和class列表
Oct 31 Javascript
ES6实现的遍历目录函数示例
Apr 07 Javascript
学习使用Bootstrap输入框、导航、分页等常用组件
May 11 Javascript
es7学习教程之Decorators(修饰器)详解
Jul 21 Javascript
jQuery中ajax获取数据赋值给页面的实例
Dec 31 jQuery
jquery的$().each和$.each的区别
Jan 18 jQuery
解决vue 给window添加和移除resize事件遇到的坑
Jul 21 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中获取系统信息的方法
2013/06/25 PHP
基于递归实现的php树形菜单代码
2014/11/19 PHP
php基于PDO实现功能强大的MYSQL封装类实例
2017/02/27 PHP
php微信支付之公众号支付功能
2018/05/30 PHP
TP5框架实现的数据库备份功能示例
2020/04/05 PHP
js的闭包的一个示例说明
2008/11/18 Javascript
经典海量jQuery插件 大家可以收藏一下
2010/02/07 Javascript
jquery+json 通用三级联动下拉列表
2010/04/19 Javascript
JavaScript 通过模式匹配实现重载
2010/08/12 Javascript
javascript动态加载二
2012/08/22 Javascript
Javascript计算两个marker之间的距离(Google Map V3)
2013/04/26 Javascript
JavaScript异步加载浅析
2014/12/28 Javascript
JavaScript获得页面base标签中url的方法
2015/04/03 Javascript
javascript关于open.window子页面执行完成后刷新父页面的问题分析
2015/04/27 Javascript
javascript 继承学习心得总结
2016/03/17 Javascript
微信小程序 Tab页切换更新数据
2017/01/05 Javascript
基于AngularJS实现表单验证功能
2017/07/28 Javascript
如何快速解决JS或Jquery ajax异步跨域的问题
2018/01/08 jQuery
浅析vue 函数配置项watch及函数 $watch 源码分享
2018/11/22 Javascript
重学JS 系列:聊聊继承(推荐)
2019/04/11 Javascript
JS解惑之Object中的key是有序的么
2019/05/06 Javascript
vue使用vuex实现首页导航切换不同路由的方法
2019/05/08 Javascript
JS 获取文件后缀,判断文件类型(比如是否为图片格式)
2020/05/09 Javascript
python通过函数属性实现全局变量的方法
2015/05/16 Python
python网络编程之数据传输UDP实例分析
2015/05/20 Python
浅析Python3中的对象垃圾收集机制
2019/06/06 Python
python pycharm的安装及其使用
2019/10/11 Python
关于numpy中eye和identity的区别详解
2019/11/29 Python
Python爬虫逆向分析某云音乐加密参数的实例分析
2020/12/04 Python
CSS3中HSL和HSLA的简单使用示例
2015/07/14 HTML / CSS
全球最大的网上自行车商店:Chain Reaction Cycles
2016/12/02 全球购物
英国在线自行车店:Merlin Cycles
2018/08/20 全球购物
C++的几个面试题附答案
2016/08/03 面试题
班主任新年寄语
2014/04/04 职场文书
法制宣传月活动方案
2014/05/11 职场文书
如何写好竞聘报告
2019/04/03 职场文书