在 vuejs 2.5 的路由器链接中设置目标 = '_blank'答案

【问题标题】：set target= '_blank' in router-link of vuejs 2.5在 vuejs 2.5 的路由器链接中设置目标 = '_blank'
【发布时间】：2018-06-24 06:27:20
【问题描述】：

如果 router-link 中有设置方法，则使用 vuejs 2.5

target= '_blank'

？我试过这样：

<router-link :to="{name: 'UserProfileView', params: {id: participantUser.user_id}, target: '_blank' }"  >

但是失败了……

谢谢！

【问题讨论】：

Can vue-router open a link in new tab?的可能重复

标签： vuejs2 routerlink

【解决方案1】：

您将在<a> 标签上添加target='_blank' 喜欢

希望很明确

【讨论】：

所以它会是这样的：<router-link :to="{name: 'UserProfileView', params: {id: participantUser.user_id}}" target= '_blank' >
如果标签不是a（例如tag="button"），它将不起作用
@igor 我认为因为默认情况下 router-link 是具有目标属性的锚标记，按钮 html 元素没有它

【解决方案2】：

你必须使用方法。方法看起来像这样：

methods: {
     redirectToUserView(user) {
      const route = this.$router.resolve({
        name: 'UserProfileView',
        params: {id: participantUser.user_id},   
      });
      window.open(route.href, '_blank');
    },
 }

【讨论】：

【解决方案3】：

下面的代码是用参数打开一个新标签。

带路由器链接=

<router-link
                  :to="{ name: 'task_section',query: {reportId: item.task,}}"
                  target="_blank"> Link Text
              </router-link>

现在访问发送的数据

this.$route.query.reportId

【讨论】：