router-link跳转新页面
时间: 2023-10-20 16:12:18 浏览: 36
要在新页面中打开路由链接,可以通过设置`target="_blank"`属性来实现。例如:
```html
<router-link to="/" target="_blank">Go to Home</router-link>
```
这将在新标签页中打开指向主页的路由链接。如果你想在新标签页中打开所有路由链接,可以使用`<a>`标签和`target="_blank"`属性,而不是`<router-link>`。
```html
<a href="/" target="_blank">Go to Home</a>
```
相关问题
router-link跳转新子页面
在Vue中,可以使用<router-link>标签来实现路由跳转。如果要在新的子页面中打开链接,可以使用target="_blank"属性。在Vue2版本中,<router-link>标签是支持target="_blank"属性的。例如,你可以在<router-link>标签中添加target="_blank"属性来在新的子页面中打开链接。具体的代码示例如下:
<router-link target="_blank" :to="{ path: '/home', params: { id: '8' } }">新页面打开home页</router-link>
这样,当你点击这个链接时,会在新的子页面中打开"/home"路径对应的页面,并且传递参数id为8。你也可以使用编程式导航来实现在新的子页面中打开链接。具体的代码示例如下:
this.$router.push({ path: '/catalog', query: { id: '1' } });
这样,当你调用这个代码时,会在新的子页面中打开"/catalog"路径对应的页面,并且传递查询参数id为1。希望这个回答对你有帮助!
router-link to跳转新页面
使用 Vue.js 和 Vue Router,你可以使用 `<router-link>` 元素来创建一个链接,以便在单页应用中跳转到新页面。
下面是一个示例:
```html
<template>
<div>
<router-link to="/page1">跳转到页面1</router-link>
<router-link to="/page2">跳转到页面2</router-link>
</div>
</template>
```
在上面的示例中,`<router-link>` 元素的 `to` 属性指定了要跳转到的路径。当用户点击链接时,Vue Router 会处理路由并渲染相应的组件。
确保你已经正确设置了 Vue Router,并在你的 Vue 实例中注册了相应的路由。这样才能保证链接跳转生效。
希望对你有所帮助!如果你有其他问题,请随时提问。