CODEWITHSUNDEEP
reactjsreact-routerreact-router-domreact-router-v4
Rob Bailey
Rob Bailey

Reputation: 981

How do I navigate from a React Child route back to a parent

In my application, I have a blog module. When the route matches '/blog' the Blog Root component is rendered according to:

<Route path="/blog" component={BlogRoot} />

Within this component there is a child router as:

<BrowserRouter>
  <Switch>
    <Route path={`${match.path}/:slug`} component={BlogPost} />
    <Route path={match.path} exact component={BlogListing} />
  </Switch>
</BrowserRouter>

I am having trouble navigating back from the BlogPost Component (which matches ${match.path}/:slug) back to the listing (the one matching path={match.path} exact). When on the Blog Post route, using a Link to="/blog" does not render the Blog Listing component (it stays on the current BlogPost).

What am I doing wrong?

Thanks in advance.

Upvotes: 1

Views: 535

Answers (1)

user10248689
user10248689

Reputation:

The reason why it is staying at the same component is, it is unable to find the next route. For this you need to define your dynamic routes (/:slug) first and then use your component route.

Upvotes: 1

Related Questions