单击按钮时反应路由器获得正确的显示页面答案

【问题标题】：react router getting the right display page when click button单击按钮时反应路由器获得正确的显示页面
【发布时间】：2021-02-08 14:53:32
【问题描述】：

我有一个问题需要重新评分。我有一个 IconButton (Material UI) 我想点击这个按钮，它会重定向到特定的帮助页面。

例如：

本地：3000/教育。当我点击按钮时，它会重定向类似 local:3000/education/support 页面。
本地：3000/数据。它重定向到数据/支持页面之类的东西。 ...等更多页面

我卡住了，我不确定如何实现按钮 onClick 功能以重定向到正确的支持页面。我正在考虑使用 react-router，我做了一些研究，我们可以使用道具中的“参数”和“历史”参数？谢谢

请给我一些好的建议和正确的方向谢谢。

【问题讨论】：

标签： javascript reactjs react-router react-router-dom

【解决方案1】：

import { useLocation, useHistory } from "react-router-dom";

export default function App() {
  const history = useHistory();
  const { pathname } = useLocation();

  return (
    <div className="App">
      <button onClick={() => history.push(`${pathname}/support`)}>
        support page
      </button>
    </div>
  );
}

【讨论】：

我不想为每个 /${pathname} 创建 20 个支持页面，你知道如何为每个路径生成支持页面吗？

【解决方案2】：

本地主机：3000/教育。如果你使用 history.push("/support")，它会重定向到 localhost:3000/support。但是如果你使用history.push("support")，它会重定向到localhost:3000/education/support

https://reactrouter.com/web/api/Hooks

【讨论】：