Menu
I'm trying to create a route that matches all of the following URLs:
/product/foo
/product/foo/bar
Here's my current route:
<Route path="/product/:productName(/:urlID)" handler={SomeHandler} />
According to the documentation on https://github.com/rackt/react-router/blob/master/docs/guides/basics/RouteMatching.md this route should match perfectly but it does not match either of the URLs above.
What do I need to do to support this optional parameter?
I'm on React Router version 0.13.3 and if I remove the (/:urlID) then I can match the first URL but not the second.
497
Basically, you can use the ? character to make the parameter optional.
To set optional props with default values in React TypeScript: Mark the props on the type as optional using a question mark. Provide default values for the props when destructuring them in the function's definition.
Step 1: Create a React application using the following command. Step 2: After creating your project folder i.e. useparams_react, move to it using the following command. Step 3: After creating the ReactJS application, Install the react-router-dom and react-dom packages using the following command.
Okay so the () syntax is specific to React Router 1.0, not 0.13.3. I ended up using the ? syntax:
<Route path="/product/:productName/?:urlID?" handler={SomeHandler} />
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