history missing in components [duplicate]

Question

I just now observed that some of my component is having history and some do not have it. My component is comp1, comp2, comp3

comp1 is parent of comp2, comp2 is parent of comp3

comp1
|____comp2
     |_____comp3

Given all are stateful components. And access to comp1 is through routing.

My observations says that those component who are connected through routers directly have only the this.props.history available.

Q. Can any one throw some light here on this fact?

Q. Can we access history on remaining components?

Answer 1

The components given to the component prop of a Route component will be given the route props. If you want a component deeper down in your app to have access to them as well, you can use the withRouter HOC.

Example

class Component3 extends React.Component {
  render () {
    console.log(this.props.history);

    return <h3> Test </h3>;
  }
}

export default withRouter(Component3);