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

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

例如:

  1. 本地:3000/教育。当我点击按钮时,它会重定向类似 local:3000/education/support 页面。
  2. 本地: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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-12-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多