Route/Redirect 使用 useNavigate 转到新标签页中的另一个页面

Question

我正在使用 ag-grid，它有一个事件 onSelectionChanged，使该行可点击。当我单击下面的行时，函数被调用。

const onSelectionChanged = useCallback(() => {

  const selectedRow = gridRef.current.api.getSelectedRows(); //get the row data

  let navigate = useNavigate();   //import { useNavigate } from "react-router-dom";
  navigate('/Detail', { state: { data: selectedRow[0]} });  //navigate to detail page

}, []);

函数导航到详情页，状态通过。但是 navigate() 在同一选项卡中调用 Detail 页面。

我想在新标签页中打开页面。这可能使用这种方法吗？或者还有其他方法可以实现我的目标？

Answer 1

react-router 不应该有助于在新选项卡中打开内容时保持状态。事实上，从根本上说，react 不应该帮助做到这一点。

我会通过两种方式解决这个问题：

如果数据足够简单，使用windows.open(window.open("http://link?key="+ value +"&key2="+ value2 ..."); )
研究其他状态管理方法，例如 localstorage 或 something else

Route/Redirect 使用 useNavigate 转到新标签页中的另一个页面

Route/Redirect to another page in new tab using useNavigate

reactjs

react-router

ag-grid

react-router-dom