如何使用 useEffect 获取合约余额？

Question

情况

我已经创建了一个智能合约并将abi和合约地址导入到我的 React 应用程序中。

我已经成功访问了我的 React 应用程序中的方法和选项。 我使用 useEffect 没有问题。

问题

但是，我正在努力获得合同的余额。 我已经尝试了我所理解的一切，但没有结果。

此代码工作正常

import web3 from "./web";
import { useState, useEffect } from "react";
import Lottery from "./Lottery";

const [isManager, setManager] = useState(
        "<em>Loading manager address...</em>"
    );

    useEffect(() => {
    const getManager = async () => {
        const mangWallet = await Lottery.methods.manager().call();
        console.log(mangWallet);
        setManager(mangWallet);
    };

    getManager();
}, []);

这不起作用 - 余额保持为 0。更重要的是，控制台日志甚至不显示 0。就好像整个getBalance function 没有运行？

const [balance, setBalance] = useState(0);

useEffect(() => {
        const getBalance = async () => {
            const contBal = await web3.eth.getBalance(Lottery.contract_address);
            setBalance(contBal);
            console.log(balance);
        };
        getBalance();
    }, []);

需要注意的几点：

• contract_address持有链上的智能合约地址，存储在 Lottery.js 文件中
• 这两个代码片段在一个文件中 - app.js 。 这意味着有两个useEffect函数。

Answer 1

我不确定你的问题是什么。 但我认为这个 async const contBal = await web3.eth.getBalance(Lottery.contract_address); 可以抛出异常。 所以我认为你需要像这样添加 try catch ：

const [balance, setBalance] = useState(0);

useEffect(() => {
    const getBalance = async () => {
        try {
          const contBal = await web3.eth.getBalance(Lottery.contract_address);
          setBalance(contBal);
          console.log(balance);
        } catch(error) {
          console.log(error);
        }
    };
    getBalance();
}, []);

关于console.log(balance) ，它总是记录 0。因为它是useEffect的行为。 所以如果你想看到balance值的变化是这样的，你需要创建另一个useEffect ：

useEffect(() => { console.log(balance) }, [balance])