• 微信公众号:美女很有趣。 工作之余,放松一下,关注即送10G+美女照片!

withRouter的作用和适用场景

开发技术 开发技术 4小时前 1次浏览
适用场景:子组件单独引入使用,不被 Route 组件所包裹,通过this 无法获取到 history、location、match
 
withRouter的作用和适用场景

 

 

 
withRouter的作用
作用:是将一个组件包裹进Route里面, 然后react-router的三个对象history, location, match就会被放进这个组件的props属性中.
withRouter的作用和适用场景

 

 

1. 默认情况下必须是经过路由匹配渲染的组件才存在this.props,才拥有路由参数,才能使用编程式导航的写法,执行this.props.history.push(‘/ ‘)跳转到对应路由的页面

然而不是所有组件都直接与路由相连(通过路由跳转到此组件)的,当这些组件需要路由参数时,使用withRouter就可以给此组件传入路由参数,此时就可以使用this.props
2. 高阶组件中的withRouter, 作用是将一个组件包裹进Route里面, 然后react-router的三个对象history, location, match就会被放进这个组件的props属性中.此时这个组件就具备了路由的属性
 

程序员灯塔
转载请注明原文链接:withRouter的作用和适用场景
喜欢 (0)