其他分享
首页 > 其他分享> > 记录一次简单且容易犯的React Hook Router 相关错误

记录一次简单且容易犯的React Hook Router 相关错误

作者:互联网

发现原因:这个错误是在引用前同事导航组件时产生的

错误描述:在使用组件时发现路由url已经改变但页面未跳转

参考资料:

https://blog.csdn.net/hsany330/article/details/106196896

https://majing.io/posts/10000050881248

解决方案:

 
//header.js 组件
//withRouter组件将注入history对象作为该组件的属性。这样,不需要处理context,可直接访问push和replace方法。
import { withRouter } from 'react-router-dom'

const Head = withRouter(({ history, container, setContainer, items}) => {
    // ...
    //引用history
    <Menu>
             <Menu.Item
              onClick={() => {
                history.push('/')
              }}
            >
              首页
             </Menu.Item>
    </Menu>
}

export default Head

标签:Head,withRouter,React,Hook,push,https,组件,Router,history
来源: https://www.cnblogs.com/ylsq/p/14078767.html