如何从 react-router 中的 useHistory 获取完整的路由历史

Question

我正在研究 useHistory() 钩子。我需要从 useHistory 路线中填充面包屑。我需要从我们来到主页或“/”的位置填写面包屑。我不知道如何使用 useHistory 来完成。我只知道像 goBack() 这样的少数方法。但它只给出了以前的路线。我需要整个历史堆栈。有什么办法可以让它做出反应？

Answer 1

要创建面包屑，您可以使用历史记录的位置对象

类似这样的：

function DashboardDetail() {
  const history = useHistory();

  const { pathname } = history.location;
  return (
    <div>
      <p>BreadCrumb: {pathname.split("/").join(" -> ")}</p>
      <h2>Dashboard Detail</h2>
    </div>
  );
}

工作示例：