Scott

react函数式路由跳转 a year ago

react
533个字符
共有84人围观

在做react开发的时候,经常要发送网络请求,比如点击了一个按钮,做数据的提交。

分析:接下来会有2种状态发生

  • success
  • error

success的时候,我们需要跳转到某个界面,你可以用window.location.href='/some/path',但是这种写法有点low。既然是SPA应用,那么最好用无刷新跳转,来看下面的demo

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

const Page2 = memo(() => {
  const navigate = useNavigate()
  const submit = () => {
    //do sth
    navigate("/a/scott/18")
  }
  return (
    <div>Page2
      <button onClick={submit}>提交数据</button>
    </div>
  )
})

export default Page2

点击提交数据后,立马发生了跳转