### 1. <router-link>标签实现新窗口打开:
官方文档中说 v-link 指令被 <router-link> 组件指令替代,且 <router-link> 不支持 target="_blank" 属性,如果需要打开一个新窗口必须要用`<a>`标签,但事实上vue2版本的 <router-link> 是支持 target="_blank" 属性的(tag="a"),如下:
```
<router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新页面打开home页</router-link>
```
### 2、编程式导航:
有些时候需要在单击事件或者在函数中实现页面跳转,那么可以借助router的示例方法,通过编写代码实现。我们常用的是 $router.push 和 $router.go 但是vue2.0以后,这种方式就不支持新窗口打开的属性了,这个时候就需要使用this.$router.resolve,如下:
```
seeShare(){ // 查看操作
let routeUrl = this.$router.resolve({
path: "/share",
query: {id:96}
});
window.open(routeUrl .href, '_blank');
}
```
当然了,你可以使用query,也可以使用params,具体请参见:
[vue-router 路由动态传参 query和params的区别](https://www.jianshu.com/p/45ee7a6bdc0c)
- 前言
- 写在前言
- 一些开发遇到的问题
- H5标签中的属性控制
- el-table的每个对象的属性值
- el-form多个表单同时验证必填项
- el-table 修改表头
- el-input的多种验证
- vue键盘回车事件
- blob导出
- table中selectable( 是否勾选)
- 手动更新视图
- 日期选择器,自定义可选范围
- select 自定义搜索
- 监听回车事件
- 表格初始化不可勾选
- el-input输入限制
- table时间格式转换
- table自适应高度
- JS问题记录
- js字符数组转换为数字数组
- js防抖和节流
- JS电脑是否有网判断
- JS属性记录
- 遍历方法(12个)
- 改变原数组(9个)
- 不改变原数组(8个)
- JS数组、字符串常用方法
- 遍历对象
- Vue
- vue-router
- vue-router 如何在新窗口打开页面
- vue-router 之 keep-alive缓存篇
- keep-alive项目案例
- 路由知识点归纳总结
- params、query传参
- vue问题记录
- vuejs npm chromedriver 报错
- vuex
- vuex个人理解
- Vuex的简单实例应用