在一個react的項目中，目前來說項目過大，數據交互多的情況下選擇使用redux和router是很常見的。下面我就用代碼的展現形式，來舉例：

我們知道在react-redux的實踐中，最外層就是render函數的使用：

import React from 'react';
import {render} from 'react-dom';
import App from './App';
//這里使用render渲染
render(
  <App/>,
  document.getElementById('root')
);

當我們使用redux的時候，就會先創建一個store，然后使用react-redux提供的Provider作為父組件包裹App：

render(
  <Provider  store={store}>
    <App/>
  </Provider>,
  document.getElementById('root')
);

當搭配router后，這里仍然不需要要改變的。我們只需要將router的配置，放入App里面的需要的組件里面：
routerMap.js:

import React,{Component} from 'react';
import {
  BrowserRouter as Router,
  Route,
  Switch
} from 'react-router-dom';
import Home from '../containers/Home';
import User from '../containers/User';
import Search from '../containers/Search';
import Detail from '../containers/Detail';
import City from '../containers/City';
import NotFound from '../containers/404Page';
class App extends Component{
  constructor(props, context){
    super(props, context);
    this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate;
  }
  render(){
    return (
      <Router>
        <div>
          {/**
           * 這里可以公共的樣式,比如 頭部, 尾部, 等.
           */}
           header
          {/*結合Switch組件可以匹配到都匹配不到的路勁,404等...*/}
          <Switch>
            <Route path='/' exact component={Home}/>
            <Route path='/user'  component={User}/>
            <Route path='/search'  component={Search}/>
            <Route path='/detail'  component={Detail}/>
            <Route path='/city'  component={City}/>
            <Route component={NotFound}/>
          </Switch>
          footer
        </div>
      </Router>
    );
  }
}
export default App;

這時候后，在最外層：

import React from 'react';
import {render} from 'react-dom';
import App from './routerMap';
//這里使用render渲染
render(
  <Provider  store={store}>
    <App/>
  </Provider>,
  document.getElementById('root')
);

其實最后router和redux的使用是互不影響的，一切正常使用就好。