1

I want to try nested routing but it is not working

Codesandbox Link

Scenario: when I route for first time on /category/bags it is rendering correctly but when I refresh on this page it is giving me error page Not found

I tried with this.props.match.url and this.props.match.path but here I am getting error like there is no prop match.url

I have tried following links

https://reacttraining.com/react-router/web/guides/quick-start

How to include the Match object into a ReactJs component class?

Nested routes with react router v4

AviatorX
  • 492
  • 1
  • 7
  • 17

2 Answers2

0

I have seen your code and found that you are using exact in parent routing:

<Route exact path="/category" component={Category} />

If you remove the exact from parent routing then it will work fine:

<Route path="/category" component={Category} />
Piyush Zalani
  • 3,686
  • 1
  • 13
  • 29
  • It worked Thanks..but exact is used to make sure correct routes are rendered not all present in given route e.g. `/category` . can you explain why it was not working? if route **/category/bags** renders on first time then it should render on refresh also – AviatorX Jan 12 '19 at 10:53
  • This is the way react router exact is meant to work, to know more you can refer following blog https://www.sitepoint.com/react-router-v4-complete-guide/ – Piyush Zalani Jan 12 '19 at 11:03
  • Glad to hear that it helps you, please accept the answer. – Piyush Zalani Jan 12 '19 at 11:03
-1

Try to use ConnectedRouter from ‘react-router-redux’ instead of BrowserRouter from 'react-router-dom'

This article i hope can help you :

https://medium.com/@Dragonza/react-router-problem-with-gh-pages-c93a5e243819

Wicak
  • 399
  • 4
  • 12