title: Not getting updated hooks value inside function
body: <p>Not getting updated value of state in function which gets triggered by eventListener. Even tried with background timer. What would be the problem?</p>
  <pre><code>displayIncomingCall() // this function gets called from UI.
  </code></pre>
  <pre><code>const callApp = () =&gt; {
    const [calls, setCalls] = useState({});
  
    const addCall = (key, value) =&gt; {
      setCalls({ ...calls, [key]: value });
    };
  
    const displayIncomingCall = number =&gt; {
      const callUUID = getCurrentCallId();
      addCall(callUUID, number);
      ...
    };
  
    const onAnswerCall = () =&gt; {
      console.log('=== onAnswerCall ::: ===', calls); &lt;--- always initial value. Not getting updated one.
    }
  
    useEffect(() =&gt; {
      console.log('=== useEffect ::: ===', calls); // getting updated value
    }, [calls]);
  
    useEffect(() =&gt; {
      RNCallKeep.addEventListener('answerCall', onAnswerCall);
      return () =&gt; {
        RNCallKeep.removeEventListener('answerCall', onAnswerCall);
      };
    }, []);
  
    console.log('=== parent ::: ===', calls); // getting updated value
  
    return (...)
  }
  </code></pre>