title: React hooks - state in useState() is not reset when route is changed
body: <pre><code>const Create = () =&gt; {
    console.log('rerender !!')
    const [parcelType, setParcelType] = useState('paper')
    console.log('parcelType =', parcelType)
  
    return (
      &lt;Container onClick={() =&gt; setParcelType('plastic')}&gt;
        &lt;BookingList /&gt;
        &lt;Card title="Business"&gt;
          &lt;p&gt;Header&lt;/p&gt;
        &lt;/Card&gt;
      &lt;/Container&gt;
    )
  }
  
  export default Create
  </code></pre>
  
  <p>I want to change parcelType state to 'plastic' when click on Container in Create component. and I want to reset parcelType state to 'paper' when route is change ( Create component re-render ). But when component re-render state is not set to paper</p>
  
  <p>For more details: CreateComponent is re-render when route is change in BookingList component</p>
  
  <pre><code> const BookingList = props =&gt; {
    const { id } = props.match.params
    const containerStyle = useTranslateSpring('-100px', '0')
  
    const itemList = items.map((item, idx) =&gt; {
      const itemStyle = useTranslateSpring('-100px', '0', '0', 200 + 200 * idx)
      const url = `/booking/${item.id}/create`
  
      return (
        &lt;ItemContainer
          onClick={() =&gt; props.history.push(url)}
          style={itemStyle}
          key={item.id}
          isactive={id === item.id}
        &gt;
          {item.id}
        &lt;/ItemContainer&gt;
      )
    })
    return &lt;Container style={containerStyle}&gt;{itemList}&lt;/Container&gt;
  }
  
  export default withRouter(BookingList)
  </code></pre>
  
  <p>Create Component is render in route by routeTemplate</p>
  
  <pre><code>const Routes = () =&gt; (
   &lt;Router basename={process.env.REACT_APP_BASE_URL}&gt;
     &lt;&gt; 
      &lt;RouteTemplate
      exact
      path="/booking/:id/create"
      component={Booking.create}
      title="Booking"
      /&gt;
     &lt;/&gt;
   &lt;/Router&gt;
  )
  </code></pre>
  
  <p>and RouteTemplate is render Component wrapped by PageTemplate component</p>
  
  <pre><code>  const RouteTemplate = props =&gt; {
    const {
      component: Component,
      title,
      query,
      isAuthenticated,
      isLanding,
      ...rest
    } = props
  
    return (
      &lt;Route
        {...rest}
        render={matchProps =&gt;
          isAuthenticated ? (
            &lt;PageTemplate title={title} isLanding={isLanding}&gt;
              &lt;Component {...matchProps} query={query} /&gt;
            &lt;/PageTemplate&gt;
          ) : (
            &lt;Redirect
              to={{
                pathname: '/',
                state: { from: props.location },
              }}
            /&gt;
          )
        }
      /&gt;
    )
  }
  </code></pre>