title: useState object set
body: <p>I am new to ReactJS and working with Hooks. I want to set state for object. Here is my code:</p>
  
  <pre><code>const StartPage = (props)=&gt; {
      const [user,setUser] = useState('')
      const [password,setPassword] = useState('')
  
      const [info,setInfo] = useState({
             email:''
          ]})
      const onUserChange=(e)=&gt;{
          const user = e.target.value
          setUser(user)
      }
      const onPasswordChange=(e)=&gt;{
          const password = e.target.value
          setPassword(password)
  
      }
      const onSubmit=(e)=&gt;{
          e.preventDefault()
          const myHeader = new Headers ({
              'APIKey':'*****',
              "Content-Type": "application/json",
              'Access-Control-Allow-Origin': '*',
              'Access-Control-Expose-Headers':'headers'
          })
          fetch(`[my_link_to_api]?username=${user}&amp;password=${password}`,{
              method:'GET',
              credentials: 'omit',
              headers:myHeader,
          })
          .then(response =&gt;response.json())
          .then(data =&gt;{
              if(data!==undefined){
                  setInfo({...info, data})
              }
              console.log(info) 
          })
          .then(()=&gt;{
              console.log(info)
              history.push({
                  pathname:'/dashboard',
                  state:info
              })
          })
          .catch((e)=&gt;{
              console.log(e)
          })
      }
      return (
          &lt;div&gt;
            &lt;form onSubmit={onSubmit}&gt;
                  &lt;input type="text" placeholder="username" onChange={onUserChange}&gt;&lt;/input&gt;
                  &lt;input type="password" placeholder="password" onChange={onPasswordChange}&gt;&lt;/input&gt;
                  &lt;button&gt;Login&lt;/button&gt;
              &lt;/form&gt;
  
          &lt;/div&gt;
           )
  }
  </code></pre>
  
  <p>The problem part is here:</p>
  
  <p>I declare object initial state here:</p>
  
  <pre class="lang-js prettyprint-override"><code>const [info,setInfo] = useState({
      email:''
  })
  </code></pre>
  
  <p>And here:</p>
  
  <pre class="lang-js prettyprint-override"><code>.then(data =&gt;{
          if(data!==undefined){
              setInfo({...info, data})
          }
          console.log(info) 
      })
  </code></pre>
  
  <p>it is just not working. It is not setting info and data in never written. How can I assign the received data (because I console logged it and it it received) to the info?</p>