title: Combing React Router and Redux made my redirection KO
body: <p>I have to combine use of Redux and React Router.
  I tried react Router alone first and when I was clicking my images I was correctly redirected.</p>
  
  <p>I followed <a href="https://redux.js.org/advanced/usage-with-react-router" rel="nofollow noreferrer">redux tutorial</a> and now when I click my images, I change the address (ex: <a href="http://localhost:3000/contact" rel="nofollow noreferrer">http://localhost:3000/contact</a>) but nothing displays as if the component was empty.</p>
  
  <p>Root.js</p>
  
  <pre><code>import React from 'react';
  import './index.css';
  import PropTypes from 'prop-types'
  import ReactDOM, { BrowserRouter as Router, Route, Link, Switch } from 'react-router-dom'
  import App from './App'
  import Users from './users'
  import Book from './Book'
  import Notfound from './notfound'
  
  import { Provider } from 'react-redux';
  import Store from './redux/Store/store'
  
  import * as serviceWorker from './serviceWorker';
  
  const Root = ({ store }) =&gt; (
      &lt;Provider store = { Store }&gt;
        &lt;Router&gt;
          &lt;div&gt;
            &lt;Switch&gt;
                &lt;Route exact path="/:filter?" component={App} /&gt;
                &lt;Route path="/users" component={Users} /&gt;
                &lt;Route path="/book" component={Book} /&gt;  
                &lt;Route path='/manual' component={() =&gt; { window.location = 'https://------'; return null;} }/&gt;
                &lt;Route path='/contact' component={() =&gt; { window.location = 'https://-------'; return null;} }/&gt;
                &lt;Route component={Notfound} /&gt;
            &lt;/Switch&gt;
          &lt;/div&gt;
        &lt;/Router&gt;
      &lt;/Provider&gt;
  )
  
  Root.propTypes = {
    store: PropTypes.object.isRequired
  }
  serviceWorker.unregister();
  export default Root
  </code></pre>
  
  <p>index.js:</p>
  
  <pre><code>import React from 'react'
  import { render } from 'react-dom'
  import { createStore } from 'redux'
  import myReducer from './redux/Reducers/myReducer'
  import Root from './Root'
  
  const store = createStore(myReducer)
  
  render(&lt;Root store={store} /&gt;, document.getElementById('root'))
  </code></pre>
  
  <p>App.js:</p>
  
  <pre><code>import React from 'react'
  import { Route, Link, Redirect, withRouter, BrowserRouter as Router } from 'react-router-dom'
  import logo from './images/logo.png';
  import book from './images/book.png';
  
  class App extends React.Component {
    constructor() {
      super();
  
      this.state = {
        date: new Date()
      };
    }
  
    render() {
      const { date } = this.state;
      return (
        &lt;div&gt;
            &lt;img src={logo} /&gt;
            &lt;img src={book} onClick={() =&gt; this.props.history.push('/book')}/&gt;
            &lt;img src={call} onClick={() =&gt; this.props.history.push('/contact')}/&gt;
        &lt;/div&gt;
      )
    }
  
  }
  export default App
  </code></pre>
  
  <p>Do you know what is wrong ?</p>