title: Warning: Can't call setState (or forceUpdate) on an unmounted component
body: <p>I am getting this warning every time I sign in,</p>
  
  <blockquote>
    <p>Warning: Can't call setState (or forceUpdate) on an unmounted
    component. This is a no-op, but it indicates a memory leak in your
    application. To fix, cancel all subscriptions and asynchronous tasks
    in the componentWillUnmount method.</p>
  </blockquote>
  
  <p>Here is my code:</p>
  
  <p>authpage.js</p>
  
  <pre><code> handleLoginSubmit = (e) =&gt; {
      e.preventDefault()
      let { email,password } = this.state
      const data = {
        email : email,
        password : password
      }
      fetch('http://localhost:3001/auth/login',{
        method : 'post',
        body : JSON.stringify(data),
        headers : {
          "Content-Type":"application/json"
        }
      }).then(res =&gt; res.json())
      .then(data =&gt; {
        if(data.success){
          sessionStorage.setItem('userid',data.user.id)
          sessionStorage.setItem('email',data.user.email)
        }
        this.setState({loginData : data,
                       userData : data,
                       email:"",
                       password:""})
        if(data.token) {
          Auth.authenticateUser(data.token)
          this.props.history.push('/dashboard')
        }
        this.handleLoginMessage()
        this.isUserAuthenticated()
      })
    }
  
  export default withRouter(AuthPage)
  </code></pre>
  
  <p>use <code>withRouter</code> so I can access props which I use to navigate <code>this.props.history.push('/dashboard')</code>
  if I didn't use withRouter I cannot access this.props</p>
  
  <p>index.js</p>
  
  <pre><code>const PrivateRoute = ({ component : Component, ...rest }) =&gt; {
    return (
      &lt;Route {...rest} render = { props =&gt; (
      Auth.isUserAuthenticated() ? (
        &lt;Component {...props} {...rest} /&gt;
      ) : (
        &lt;Redirect to = {{
          pathname: '/',
          state: { from: props.location }
        }}/&gt;
      )
    )}/&gt;
    )
  }
  
  const PropsRoute = ({ component : Component, ...rest }) =&gt; (
    &lt;Route {...rest} render = { props =&gt; (
      &lt;Component {...props} {...rest} /&gt;
    )}/&gt;
  )
  
  const Root = () =&gt; (
    &lt;BrowserRouter&gt;
      &lt;Switch&gt;
        &lt;PropsRoute exact path = "/" component = { AuthPage } /&gt;
        &lt;PrivateRoute path = "/dashboard" component = { DashboardPage } /&gt;
        &lt;Route path = "/logout" component = { LogoutFunction } /&gt;
        &lt;Route component = { () =&gt; &lt;h1&gt; Page Not Found &lt;/h1&gt; } /&gt;
      &lt;/Switch&gt;
    &lt;/BrowserRouter&gt;
  )
  </code></pre>
  
  <p>I think the problem is with my withRouter, 
  how can we access this.props without using withRouter ?</p>