前端

withRouter的应用,React中路由跳转this.props没有history

2019-08-02聚力创意

在组件中,需要跳转路由,但是有时候this.props中没有history对象,默认情况下只有经过路由匹配渲染的组件才有historylocationmatch对象,才能执行this.props.history.push('/detail')跳转到对应页面。

withRouter的作用就是来给组件注入路由相关的一些参数

用法:

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

withRouter(connect(mapStateToProps,mapDispatchToProps)(Header))

一定要保证withRouter在最外层

其他react路由跳转的方式

// 1. Link标签
<Link to='/'>首页</Link>

// 2. Redirect标签
<Redirect to="/" />
蜀ICP备17044229号