Ask Please!! nested Router gives Warnings, but still working

[vianhanif]

Hi there... I am still new with routing in react. Just wanna ask. am i doing this right? So I have some features that each one has their own CRUD urls (like to see list, create new item, etc). But I am trying to seperate each feature to have its own main routes. So here's what I did to do it:

here's how i create url routes for feature called 'user' and 'member'

1. user-routes.jsx

   
   import React, { Component } from 'react';
   import {Router, Route, browserHistory, hashHistory} from 'react-router'
   import {User} from 'pages'

class UserRoutes extends Component { constructor(props) { super(props); }

render() {
    return (
      <Router history={browserHistory}>
        <Route path="/users" component={User.Home}/>
      </Router>
    );
}

}

export default UserRoutes;

2. member-routes.jsx
```javascript
import React, { Component } from 'react';
import {Router, Route, browserHistory, hashHistory} from 'react-router'
import {Member} from 'pages'

class MemberRoutes extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
          <Router history={browserHistory}>
            <Route path="/members" component={Member.Home}/>
          </Router>
        );
    }
}

export default MemberRoutes;

and I create a main route to combine those routes with this

3. main-route.jsx

   
   import React, { Component } from 'react';
   import {Router, Route, browserHistory} from 'react-router'
   import {ContainerApp} from 'containers'
   import {
   MemberRoutes,
   UserRoutes
   } from './apps/_routes'

class MainRoute extends Component { constructor(props) { super(props); }

render() {
    return (
        <Router history={browserHistory}>
          <Route path="/" component={ContainerApp}>
            <Route path="/members" component={MemberRoutes}/>
            <Route path="/users" component={UserRoutes}/>
          </Route>
        </Router>
    );
}

}

export default MainRoute;

And every time I click a link, it will be handled from the main-route, but it keeps giving this error whenever I click the links
![](http://g.recordit.co/CAMPl7gznp.gif)

I still thinks it won't harm me any further, but I can't ignore it.
Any response would be really great~ 

[ghostsquad]

You only need the router at the top level. Keep the routes in the sub-components, just remove the router.