title: How do I grab Contract Balance with useEffect?
body: <p><strong>Situation</strong></p>
  <p>I have created a smart contract and imported the <code>abi</code> and contract address into my react application.</p>
  <p>I have successfully accessed the methods and options within my react app. I used useEffect with no issues.</p>
  <p><strong>Problem</strong></p>
  <p>However, I am struggling to get the balance of the contract. I have tried everything I understand with no result.</p>
  <p><strong>This code works fine</strong></p>
  <pre><code>import web3 from &quot;./web&quot;;
  import { useState, useEffect } from &quot;react&quot;;
  import Lottery from &quot;./Lottery&quot;;
  
  const [isManager, setManager] = useState(
          &quot;&lt;em&gt;Loading manager address...&lt;/em&gt;&quot;
      );
  
      useEffect(() =&gt; {
      const getManager = async () =&gt; {
          const mangWallet = await Lottery.methods.manager().call();
          console.log(mangWallet);
          setManager(mangWallet);
      };
  
      getManager();
  }, []);
  </code></pre>
  <p><strong>This does NOT work - the balance remains 0. More importantly, the console log doesn't even show 0. It's as if the entire <code>getBalance</code> function is not running?</strong></p>
  <pre><code>const [balance, setBalance] = useState(0);
  
  useEffect(() =&gt; {
          const getBalance = async () =&gt; {
              const contBal = await web3.eth.getBalance(Lottery.contract_address);
              setBalance(contBal);
              console.log(balance);
          };
          getBalance();
      }, []);
  </code></pre>
  <p>A few things to be aware of:</p>
  <ul>
  <li><code>contract_address</code> is holding the smart contract address on-chain, stored in the Lottery.js file</li>
  <li>these two code snippets are in one file - <code>app.js</code>. Meaning there are two <code>useEffect</code> functions.</li>
  </ul>