单击 ReactJS 中的链接时在新窗口中打开页面答案

【问题标题】：Open page in new window when clicking a link in ReactJS单击 ReactJS 中的链接时在新窗口中打开页面
【发布时间】：2019-11-13 07:27:17
【问题描述】：

在我的 React 应用程序中，单击 Bootstrap 表中的链接时，我需要在新窗口中打开一个页面。请帮我举个例子。

之前，我将表格单元格设置在一个变量中，并将其分配给表格标题中的数据格式。如何更改此代码以在新窗口中打开？

更新：按照以下建议进行代码更改后，页面将在新选项卡中打开，但 testid 未传递到其他页面（使用 this.props.testid 获取）。

column1 = (cell, row) => {
  let link = `${cell}`
  return (
    <Link to={{                
      pathname: '/test',
      state: {
        testId: row.testid
      }
    }} target="_blank" rel='noopener noreferrer'>
      {cell}
    </Link>
}

【问题讨论】：

你能分享你尝试过的例子吗？或者你在哪里卡住了？
添加了示例代码。

标签： reactjs react-router

【解决方案1】：

不妨试试这个：

 <td onClick={()=> window.open("LinkToOpen", "_blank")}>Link</td>

【讨论】：

【解决方案2】：

你可以像这样定义锚标签来响应在新窗口中打开

定义 rel="noopener noreferrer" 以避免反应中的警告。

<a href="https://google.com" rel="noopener noreferrer" target="_blank">google</a>

【讨论】：

【解决方案3】：

使用常规链接，但将其设置为表格单元格：

<a style={{display: "table-cell"}} href="someLink" target="_blank">text</a>

【讨论】：