So ive tried figuring this out for a few hours and I can console.log the balance, but I cannot seems to store the balance in a var to be used later. The goal is the get the users account balance (eth) and display it in the table. Anyway heres what I got.
function App(){
///.....////
const Web3 = require("web3");
const web3 = new Web3(
Web3.givenProvider ||
"https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161"
);
async function checkBalance() {
try {
await web3.eth.getBalance(account).then(web3.utils.fromWei());
} catch (error) {
console.log(error);
}
}
////.....//// {checkBalance} to be displayed in a table
<Table variant="striped" width="100%">
<TableCaption>Token balances of {account}</TableCaption>
<Thead>
<Tr>
<Th>Token</Th>
<Th>Contract Address</Th>
<Th>Balance</Th>
</Tr>
</Thead>
<Tbody>
<Tr>
<Td>ETH</Td>
<Td>0x0000000000000000000000000000000000000000</Td>
<Td>{checkBalance}</Td>
</Tr>
</Tbody>
<Tfoot>
<Tr>
<Th>Token</Th>
<Th>Contract Address</Th>
<Th>Balance</Th>
</Tr>
</Tfoot>
</Table><script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>The error I get in the console is "Warning: Functions are not valid as a React child. This may happen if you return a Component instead of from render. Or maybe you meant to call this function rather than return it."
The function web3.eth.getBalance(address).then() requires a function to be passed into the then() clause.
In the snippet below I'm passing a function that accepts balanceInWei as a parameter. Only then you can pass balanceInWei variable to the web3.utils.fromWei(balanceInWei) function for it to return the ETH balance of the address
const Web3 = require("web3");
const web3 = new Web3("https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161");
let address = "0x0000000000000000000000000000000000000000";
let balance;
async function checkBalance() {
try {
web3.eth.getBalance(address).then((balanceInWei) => {
balance = web3.utils.fromWei(balanceInWei);
console.log("Balance in wei:", balanceInWei);
console.log("Balance in ETH:", balance);
});
} catch (error) {
console.log(error);
}
}
checkBalance();
Additionally you shouldn't post your infura links. You made the credentials of your infura project public by posting it here. Next time replace it with eq. https://ropsten.infura.io/v3/XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX