React-router: Paths with optional trailing slash and child routes

Created on 4 Feb 2015  Â·  9Comments  Â·  Source: ReactTraining/react-router

My routes look like this:

  <Route name="app" path="/" handler={Index}>
    <Route name="members" path="members/?" handler={Members}>
      <Route name="member" path=":email/?" handler={Member} />
    </Route>
  </Route>

If I link to a member with

  <Link to="member" params={{email: '[email protected]'}}>Member</Link>

the href generated is /members//[email protected]/

Can we combine that double slash into one?

bug

Most helpful comment

@ryanflorence you mentioned that trailing slashes are optional as of 1.0... i'm on 3.x and still see this behavior. is there something I need to do to enable the optional trailing slashes? users aren't happy when they go to /about/ and nothing shows up.

All 9 comments

Thanks for the issue.

Care to make a pull request with a failing test case? Don't need to fix it, just make a test that shows the bug.

If you want to fix it, that would be awesome too :)

Sure, I can take a look at it later today.

:guitar:

I'm running into this as well – would like an easy way to redirect from a case like this /pathname/ to /pathname

Any hints on where to get started? I'm happy to add some test cases, just need a bit of a push in the right direction.

My similar use case:

  <Route handler={KnowledgeBase} name="guide">
    <Route name="categories" path=":section" handler={Categories} addHandlerKey={true}>
      <Route name="article" path=":category/:article" handler={SingleArticle} addHandlerKey={true}/>
    </Route>
    <Redirect from=":section/" to=":section" />
  </Route>

Removing slash duplication would work just as well

:+1: This just bit me as well.

Made pull request with failing test

+1

    <Redirect from="/*/" to="/*" />

@ryanflorence you mentioned that trailing slashes are optional as of 1.0... i'm on 3.x and still see this behavior. is there something I need to do to enable the optional trailing slashes? users aren't happy when they go to /about/ and nothing shows up.

Was this page helpful?
0 / 5 - 0 ratings