title: Component not rendering on redirect
body: <p>On submit of a form I want to redirect to another page. My files are as such:</p>
  
  <p>Main.js</p>
  
  <pre><code>import Home from '../Home'
  import Results from "../Results";
  
      class Main extends Component {
      render() {
          return (
              &lt;Router&gt;
                  &lt;Switch&gt;
                      &lt;Route path="/" component={Home}/&gt;
                      &lt;Route path="/show_parsed_results" exact component={Results}/&gt;
                  &lt;/Switch&gt;
              &lt;/Router&gt;
          );
      }
  }
  
  export default Main;
  </code></pre>
  
  <p>Home.js(Only relevant code is added here.):</p>
  
  <pre><code>class Home extends Component {
      state = {
          filepath: '',
          skiplines: 0,
          is_loading: false,
          is_error: false,
          is_success: false,
          err_message: ''
      };
  
      handleSubmit = event =&gt; {
          event.preventDefault();
  
          API.post(`path`, path_inputs)
              .then(res =&gt; {
                  console.log(res);
                  console.log(res.data);
                  this.setState({
                      is_loading: false,
                      is_success: true
                  })
              })
              .catch(err =&gt; {
                  this.setState({
                      is_error: true,
                      is_loading: false,
                      err_message: err['message']
                  })
              })
      };
  
      render() {
          if (this.state.is_success) {
              return &lt;Redirect to='/show_parsed_results'/&gt;
          } else {
              return (
                  .....render form here.....
              );
          }
      }
  }
  
  export default Home;
  </code></pre>
  
  <p>Results.js(The component to be rendered after submission)</p>
  
  <pre><code>class Results extends Component {
      render() {
          return (
              &lt;div className="container"&gt;
                  &lt;Button className="center-align"&gt;Show Product Price Per Place &lt;/Button&gt;
                  &lt;Button className="center-align"&gt;Show Sales Aggregation Per Place &lt;/Button&gt;
              &lt;/div&gt;
          );
      }
  }
  
  export default Results;
  </code></pre>
  
  <p>I have redirected if the is_success variable is true to the path <code>show_parsed_results</code>. In my router I have mapped this path to my <code>Results</code> component. </p>
  
  <p>But on submission, the page is being redirected but it is empty. Its not picking up the Results component code at all. What am I missing here? </p>
  
  <p>I understand this could be duplicate of <a href="https://stackoverflow.com/questions/49738249/react-router-v4-redirecting-on-form-submit">Redirecting on form submit</a>, but I have followed the exact same procedure and am not able to achieve the redirection correctly. Can some help in finding what I am missing here?</p>
  
  <p>Thanks in advance.</p>
  
  <p>Edit: adding tree structure and import statements.</p>
  
  <p>Tree Structure:</p>
  
  <pre><code>.
  ├── App.css
  ├── App.test.js
  ├── Home
  │   └── index.js
  ├── Main
  │   └── index.js
  ├── Results
  │   └── index.js
  ├── api
  │   └── index.js
  </code></pre>