useTokenBalance

Hook for fetching the balance a wallet has for a specific ERC20 token.

Note: This hook is for custom ERC20 tokens. For native tokens such as Ether, use useBalance or useBalanceForAddress instead.

Available to use on contracts that implement the ERC20 interface.

import { useTokenBalance } from "@thirdweb-dev/react";

const { data, isLoading, error } = useTokenBalance(
  contract,
  "{{wallet_address}}",
);

Usage

Provide your token contract instance and a wallet address as the arguments.

The wallet address provided as the second argument is the address you want to fetch the balance for.

import { useTokenBalance, useContract } from "@thirdweb-dev/react";

// Your smart contract address
const contractAddress = "{{contract_address}}";

// Your wallet address
const walletAddress = "{{wallet_address}}";

function App() {
  const { contract } = useContract(contractAddress, "token");
  const { data, isLoading, error } = useTokenBalance(contract, walletAddress);
}

Return Value

The hook returns an object containing the following properties:

Return Value

{
  // The symbol of the token
  symbol: string;

  // The balance of the address
  value: BigNumber;

  // The name of the token
  name: string;

  // The number of decimals off the token
  decimals: number;

  // The formatted balance
  displayValue: string;
}