useDApp
Ethereum 🤝 React

import { formatUnits } from '@ethersproject/units'

const DAI = '0x6b175474e89094c44da98b954eedeac495271d0f'

export function TokenBalance( ) {
    const { account } = useEthers( )
    const tokenBalance = useTokenBalance(DAI, account)
                  
return (
      <div>
         {tokenBalance && <p>Balance: {formatUnits(tokenBalance, 18)}</p>}
      </div>
    )
}

  1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

function useTokenBalance (
  tokenAddress: string | Falsy,
  address: string | Falsy
) {
  const [tokenBalance] =
    useContractCall (
      address && tokenAddress && {
          abi: ERC20Interface, // ABI interface of the called contract
          address: tokenAddress, // On-chain address of the deployed contract 
          method: "balanceOf", // Method to be called 
          args: [address], // Method arguments - address to be checked for balance 
        }
    ) ?? [ ];
 return tokenBalance;
}
  1
2
3
4
5
6
7
8
9
10
11
12
13
14
15