title: getting data from browser indexed db then call api
body: <p>I have the following useEffect call back function :-</p>
  <pre><code>import { initDB, useIndexedDB } from &quot;react-indexed-db&quot;;
  initDB(DBConfig);
  
  const db = useIndexedDB(&quot;reads&quot;);
  
      useEffect(() =&gt; {
          db.getByIndex(&quot;hash&quot;, props.match.params.id).then((data) =&gt; {
            setToken(data.token);
          });
          handleTextColorSelection(backgroundColor);
          axios
            .post(`${process.env.REACT_APP_API_URL}khatma/read`, {
              khatma: props.match.params.id,
              part: props.match.params.part,
              section: props.match.params.section,
              token: token,
            })
            .then((res) =&gt; {
          
              if (res.data.token) {
                db.add({
                  hash: props.match.params.id,
                  token: res.data.token,
                }).then(
                  (event) =&gt; {},
                  (error) =&gt; {
                    console.log(error);
                  }
                );
              }
      })
  </code></pre>
  <p>In axios post body i am sending token , if &quot;token&quot; state receive a value stored before in browser indexed db, if there is not object store data found , then a post token will be sent as null.</p>
  <p>The problem here, that i noticed that before the  db.getByIndex(&quot;hash&quot;, ... command get a result, an axios request run, and sending a token as null, even-though later on token state will get a value.</p>
  <p>How can i run the db.getByIndex(&quot;hash&quot;, then if it finish , run axios post request ?</p>