VueJS 2.6 中的编程路由和“在新选项卡中打开链接”选项

Question

我有一个按钮，如果我点击它，就会将我带到一个新页面。它看起来像这样并且工作得很好（简化的例子）：

<v-btn :to="{name: 'route-name'}">GO</v-btn>

我可以左键单击它，它将在当前选项卡中打开，或者我可以右键单击它，选择“在新选项卡中打开链接”选项，它将在新选项卡中打开。

我想通过编程路由实现相同的行为，但我不知道如何实现。我尝试过类似的事情：

<template>
    ...    
    <v-btn @click="goto">GO</v-btn>
    ...
</template>
<script>
    ...
    methods: {
        goto(){
            this.$router.push({name: 'route-name'})
        }
    }
    ...
</script>

当我想在当前选项卡中打开新页面（左键单击）但右键单击“在新选项卡中打开链接”选项时不会出现。

有办法让它出现吗？

请注意，我不想总是在新选项卡中打开它，但我希望能够同时执行这两种操作（在当前选项卡或新选项卡中打开）

Answer 1

如 Docs 中所述，您可以对不同的点击事件设置不同的操作，例如使用

@click.right

而不是单独使用

@click

，或者您可以通过事件 ctrlKey 属性进行决定，如此处

所述