react-router之withRouter

发表于 | 分类于

You can get access to the history object’s properties and the closest ‘s match via the withRouter higher-order component. withRouter will pass updated match, location, and history props to the wrapped component whenever it renders.

原理

  • 通过高阶组件将普通React组件包装成Route
  • Route是默认值（path是/且exact为false）意味着无论访问什么路径都会匹配
  • render方法可以控制（如何）条件渲染组件
    1
    2
    3
    4
    5
    6
    7
    export default (Component) => {
      return function(props){
        return <Route render={routeProps=>{
          return <Component {...routeProps} />;
        }}></Route>
      }
    };