React router dom v5，点击时重定向到另一个URL

Question

我正在使用

React Router Dom v5

，并且，我想从

localhost:3000/v3/cars

的 url 导航到

localhost:3000/cars

onClick。

histiry.push()

添加在当前 url 的末尾，但不会更改/覆盖它。 例如：

history.push('edit')

会将网址更改为

"localhost:3000/v3/cars/edit"

而不是

"localhost:3000/v3/edit"

我如何导航到不同的路径？

Answer 1

使用 React Router DOM 5.2.1，可以使用“../”向上导航一级。

history.push({
   pathname: '../cars'
});

这将有助于导航到 /v3/cars 一级并替换为 /cars。

Answer 2

在

React router dom v5

中你需要使用

<Redirect/>

，它可能是这样的

function Register () {
  const [toDashboard, setToDashboard] = React.useState(false)

  if (toDashboard === true) {
    return <Navigate to='/dashboard'/>
  }

  return (
    <div>
      <h1>Register</h1>
      <Form afterSubmit={() => setToDashboard(true)} />
    </div>
  )
}

查看 React router dom v5 上关于

Redirect

这里

的文档

但我还是建议使用 React router v6，使用

useNavigate

更容易，请查看文档这里