5

I am a little confused on how to do (multiple) optional path parameters from the root. I'm using react-router 3, and redux 4.3.

From what I understand, (/:param1)(/:param2) should work, but I am getting the following error when loading the app:

[react-router] Location "/property/3633" did not match any routes.

index.js:

import React from 'react';

import ReactDOM from 'react-dom';

import { Provider } from 'react-redux';

import { Router, browserHistory, Route } from 'react-router';

import { syncHistoryWithStore } from 'react-router-redux';

import configureStore from './store/configureStore';

import {MyContainer} from "./containers/MyContainer";

const store = configureStore();
const history = syncHistoryWithStore(browserHistory, store);

ReactDOM.render(
    <Provider store={store}>
        <Router history={history}>
            <Route path="/(/:Type)(/:Id)" component={MyContainer}/>
        </Router>
    </Provider>,
    document.getElementById('root'),
);

FYI I have tried:

path="(/:Type)(/:Id)" 
path="(/:Type)/(/:Id)" 
path="/(/:Type)/(/:Id)" 
path="/(/:Type)(/:Id)" 
path="/:Type/:Id" // Only works when params are supplied

And this works:

<Route path="/test(/:Type)(/:Id)" component={MyContainer}/>

But again, this does not:

<Route path="/(/:Type)(/:Id)" component={MyContainer}/>
1
  • how about path="(/:Type)(/:Id)" ? Commented Apr 18, 2018 at 19:57

2 Answers 2

1

Had the same issue today. I managed to resolve it like this:

<Route path="/(:param1)(:/param2) component={SomeComponent}"
Sign up to request clarification or add additional context in comments.

1 Comment

This works for me, not sure how I missed that configuration.
1

You need to add some realtive path, rather than directly giving params. <Route path="/get/(:Type)/(:Id)" component={MyContainer}/>

6 Comments

he is using react-router v3
<Route path="/:Type/:Id" component={MyContainer}/> does work IF those params exist, if not then I get an error: Location "/" did not match any routes. And yes react-router v3
@ians You need to add some realtive path, rather than directly giving params. <Route path="/get/:Type/:Id" component={MyContainer}/>
@ChasingUnicorn <Route path="/test(/:Type)(/:Id)" component={MyContainer}/> works. So there is no way to add optional params at the route?
Checkout this post: stackoverflow.com/questions/35604617/… . This might help.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.