Question

我正在尝试这样做，以便当用户单击我的标签时，它会打开一个带有指定URL的新标签。目前无法使用。有任何想法我做错了或需要做的事情吗？

rerouteToGoogle= () => {
    return <Link to="google.com" />

}

<MediaQuery query="(min-width: 550px)">
  <div style={styles.alignText}>
  <Label color='green' basic onClick={this.rerouteToGoogle} >CSV</Label>
  </div>
</MediaQuery>

Answer 1

在您的情况下，

rerouteToGoogle呈现链接组件。我相信您要实现的目标是在点击时打开新标签页链接，而不是呈现它。在这种情况下，只需将功能更改为

rerouteToGoogle= () => window.open('www.google.com', "_blank")

Answer 2

<Link>的目的是在React应用程序中从一条路线导航到另一条路线，例如从/home到/about。如果要在新选项卡中打开另一个站点，则不是要在应用程序内部导航，因此不能使用<Link>。

对于您而言，经典的<a href="https://google.com" target="_blank">可以使用。

因此，要解决您要达到的目标，最简单的方法是在<a>内添加<Label>：

<MediaQuery query="(min-width: 550px)">
  <div style={styles.alignText}>
  <Label color='green' basic>
    <a href="https://google.com" target="_blank">CSV</a>
  </Label>
  </div>
</MediaQuery>

反应：在新标签页中打开链接

2 个答案: