redux 如何在react js中管理深度路由器动态id页面以返回到前一个页面

cpjpxq1n 于 2023-02-19 发布在 React

关注(0)|答案(2)|浏览(142)

我正在尝试为我的react项目实现一个路由。对于react路由器dom来说没有问题，但是我想知道如何管理深度路由页面的id，以便能够回到以前的页面。
到目前为止，我已经实现了useLocation，也useParams，但我不能弄清楚它的正确方式。在我的情况下，我有3级页面“主类别--〉类别--〉子类别“。每个类别有多个子类别，所以ID必须是动态的。
问题是，当我在“子类别”，我回去，React不知道我来自哪个“类别”。
我是否应该将“类别ID”传递到子类别页面？最好使用useLocation、useParams或Redux？或者您有其他更好的解决方案...

`const location = useLocation();

  const catName = location.state?.name;
  const catID = location.state?.id;`

  <BackArrow to={`/catPage/${catID}`} title={catName}/>

redux

来源：https://stackoverflow.com/questions/75482789/how-to-manage-deep-router-dynamic-id-pages-to-go-back-to-previous-one-in-react

2条答案

按热度按时间

fwzugrvs1#

如果你想回到react-router-dom v6中的上一页，那么你可以使用useNavigate。

import { useNavigate } from 'react-router-dom'

const Component = () => {
   const navigate = useNavigatge()

   return (
      <button onClick={() => navigate(-1)}>Go back</button>
   )
}

如果您想后退两页，也可以将navigate中的数字更改为-2，以此类推。

赞(0）回复(0）举报 2023-02-19

s71maibg2#

假设您的路由结构由嵌套路由组成，您可以使用react-router-dom的Link（Source）来使用相对路径，如下所示：

<Link to="../">Parent category</Link>

// OR in some cases

<Link to=".." relative="path">Parent category</Link>

也许还可以看看useNavigate钩子（React-dom doc）

赞(0）回复(0）举报 2023-02-19

我来回答

redux 如何在react js中管理深度路由器动态id页面以返回到前一个页面

2条答案

相关问题

热门标签

最新问答