title: useState is not updating initial value in useEffect
body: <p>I am working on like functionality for my web-app. The problem here is my setLike is not changing the state even after using setLike(!like). I checked this with console.log() by using it before and after the setlike() but both the console.log() statements were giving me the same value. Here is my Post component.</p>
  <pre><code>import React , {useState,useEffect} from 'react'
  import './Post.css'
  import Avatar from '@material-ui/core/Avatar';
  import {Button, IconButton, Input, Typography } from '@material-ui/core';
  import {DataBase} from './firebase'
  import firebase from 'firebase';
  import FavoriteIcon from '@material-ui/icons/Favorite';
  import {useStateValue} from '../contexts/StateProvider'
  
  
  function Post({postId}) {
  
     //get the user from the provider
     const [{user}, dispatch] = useStateValue();
     //number of likes
     const [likeCount,setLikeCount] = useState(likesCount)
     //if like=true or not
     const [like, setLike] = useState(false);
  </code></pre>
  <p>I am using firebase firestore database for backend. The like document only exists in the database collection when the user interacts with it for the first time (likes it or likes it first and then does undo like). So first check whether user previously liked the document or not. If user previously liked the document, then get the value of the like for that particular user (true/false) and set it using setLike(like). Also get the number of documents in the collection who have like==true and set it equal to setLikeCount(likeCount).</p>
  <pre><code>//=======Get likes from the database ===========================
  useEffect(() =&gt; {       
  //check if the user already liked the doc or not  (first time or not)
  DataBase.collection('posts').doc(postId).collection('postLikes')
  .doc(user.uid).get().then((doc) =&gt; {
              if (doc.exists) {
                  console.log(doc.data().like)
                  //set like to value of like from database
                  setLike(doc.data().like)
  
              } else {
                  // doc.data() will be undefined in this case
                  console.log(&quot;Not liked&quot;);
              }
          }).catch((error) =&gt; {
              console.log(&quot;Error getting document:&quot;, error);
          });
  
  
  //grab the docs which have like=true 
  DataBase.collection('posts').doc(postId).collection('postLikes').where(&quot;like&quot;, &quot;==&quot;, 
  true).get()
              .then((querySnapshot) =&gt; {
                  setLikeCount((querySnapshot.docs.map(doc =&gt;doc.data())).length)
                  console.log(likeCount +&quot; likes count&quot;)
              })
              .catch((error) =&gt; {
                  console.log(&quot;Error getting documents: &quot;, error);
              });
              
  
            
  }
  
  //when postId changes or page loads fire the code above
  },[postId])
  </code></pre>
  <p>Here is my postLike function. The setLike(!like) is supposed to toggle the previous like value the user has for the document from firebase. I guess this is not updating.</p>
  <pre><code>//=============Post likes to the database=======
  
  const postLike = (e) =&gt; {
     //if already liked i.e. doc exists
     console.log(like+&quot;like before&quot;)
     setLike(!like)
     console.log(like+&quot;like after&quot;)
     like?(setLikeCount(likeCount+1)):(setLikeCount(likeCount-1))
     console.log(&quot;likeCount&quot;+likeCount)
     DataBase.collection('posts').doc(postId).collection('postLikes').doc(user.uid).set(
      { 
          like:like,
          username:user.displayName,
          timestamp:firebase.firestore.FieldValue.serverTimestamp(),
  
      }
    ).catch((err)=&gt;{console.log(&quot;something wrong happened &quot;+err.message)})
  
  
  }
                            
  
  return (
     &lt;div className=&quot;post&quot;&gt;
          &lt;div className=&quot;post__likes&quot;&gt; 
  
                           {/*like button*/}                                              
                                                                                                       
   {
    like?
    (&lt;Button onClick={postLike} &gt;&lt;FavoriteIcon   fontsize=&quot;small&quot; cursor=&quot;pointer&quot; onClick=. 
    {postLike} style={{color:'red'}}/&gt;&lt;/Button&gt; ):
    (&lt;Button onClick={postLike} &gt;&lt;FavoriteIcon   fontsize=&quot;small&quot; cursor=&quot;pointer&quot;  /&gt; 
     &lt;/Button&gt;)                                       
  }
                                         
           &lt;Typography style={{color:'aliceblue'}}&gt;Liked by {likeCount}&lt;/Typography&gt;
            &lt;/div&gt;
  
         &lt;/div&gt;
     )
  }
  
  export default Post
  </code></pre>