router link跳转打开新窗口

回答: 如果你想在router link跳转时打开一个新的窗口，有几种方法可以实现。第一种方法是在router-link标签中添加target="_blank"属性，如下所示：\[1\]\[2\]

<router-link target="_blank" :to="{ path: '/catalog', query: { id: '1' } }">打开新的标签页</router-link>

第二种方法是使用编程式跳转，在点击事件中使用window.open()方法打开一个新的窗口，如下所示：\[3\]

<a href="javascript:void(0);" @click="fn">About</a>

fn() {
  let routeUrl = this.$router.resolve({ path: "/about" })
  window.open(routeUrl.href, '_blank')
}

无论使用哪种方法，你都可以在router-link标签中添加其他属性来实现不同的效果。例如，你可以使用replace属性来在页面切换时不留下历史记录，或者使用tag属性将router-link渲染成其他标签。\[3\]
#### 引用[.reference_title]
- *1* [vue-router跳转路由打开新窗口的方式(3-4版本都适用)](https://blog.csdn.net/weixin_68658847/article/details/130628760)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [vue-router路由跳转与打开新窗口](https://blog.csdn.net/weixin_50576800/article/details/125024849)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [router-link打开新页面跳转和a标签防止默认跳转及各个属性](https://blog.csdn.net/m0_62823653/article/details/125250313)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]