title: React router v4 use declarative Redirect without rendering the current component
body: <p>I am using a similar code like <a href="https://gist.github.com/verticalgrain/195468e69f2ac88f3d9573d285b09764" rel="nofollow noreferrer">this</a> to redirect in my app after users logged in. The code looks like the following:</p>
  
  <pre><code>import React, { Component } from 'react'
  import { Redirect } from 'react-router'
  
  export default class LoginForm extends Component {
    constructor () {
      super();
      this.state = {
        fireRedirect: false
      }
    }
  
    submitForm = (e) =&gt; {
      e.preventDefault()
      //if login success
      this.setState({ fireRedirect: true })
    }
  
    render () {
      const { from } = this.props.location.state || '/'
      const { fireRedirect } = this.state
  
      return (
        &lt;div&gt;
          &lt;form onSubmit={this.submitForm}&gt;
            &lt;button type="submit"&gt;Submit&lt;/button&gt;
          &lt;/form&gt;
          {fireRedirect &amp;&amp; (
            &lt;Redirect to={from || '/home'}/&gt;
          )}
        &lt;/div&gt;
      )
  
    }
  }
  </code></pre>
  
  <p>Works fine when a successful login has been triggered. But there is the case, that logged in users enter the login page and should be automatically redirected to the "home" page (or whatever other page).</p>
  
  <p>How can I use the Redirect component without rendering the current component and without (as far as I understand <a href="https://stackoverflow.com/questions/42123261/programmatically-navigate-using-react-router-v4">discouraged</a>) imperative pushing to the history (e.g. in <code>componentWillMount</code>)?</p>