I'm loving v4 but in 4.1.2 this keeps tripping me up when using the browser router:
With a component in a Route component I have these props passed in: {computedMatch, location, path}
although the documentation tells me to expect {match, location, history}
which is what I get with the hash router.
To get the history passed in I have to use the withRouter
wrapper which feels very clunky because the relevant component is the component prop to a Route component.
The documentation sounds right to me. Is this a bug?
import React, { PureComponent } from 'react'; import { withRouter } from 'react-router-dom'; class PassToMeMyRouterHistory extends PureComponent { redirectToHome = () => { const { history } = this. props; if(history) history. push('/home'); } render() { const { history } = this. props; return( (history) ?
React Router uses the history package, which builds on the browser history API to provide an interface to which we can use easily in React apps. location - (object) The current location. May have the following properties: pathname - (string) The path of the URL.
history prop is the history API which is used to navigate user to other view programatically, which are are going to do in a bit. In ContactUs component, we will make use of match prop to take out some hardcoded values of path and location. match. url return URL path for which a component was rendered.
You can get access to {match, location, history}
if you use Route as
<Route path="/" component={myComponent}
In above code you will have match location and history accessible inside myComponent.
Or else you have to use withRouter
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With