• React
  • Hooks
  • useToken

useToken

Hook for fetching ERC-20 token information.

import { useToken } from 'wagmi'

Usage

The follow examples use $ENS.

import { useToken } from 'wagmi'   function App() {  const { data, isError, isLoading } = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  })    if (isLoading) return <div>Fetching token…</div>  if (isError) return <div>Error fetching token</div>  return <div>Token: {data?.symbol}</div> }

Return Value

{  data?: {  address: string  decimals: number  name: string  symbol: string  totalSupply: {  formatted: string  value: bigint  }  }  error?: Error  isIdle: boolean  isLoading: boolean  isFetching: boolean  isSuccess: boolean  isError: boolean  isFetched: boolean  isFetchedAfterMount: boolean  isRefetching: boolean  refetch: (options: {  throwOnError: boolean  cancelRefetch: boolean  }) => Promise<{  address: string  decimals: number  symbol: string  totalSupply: {  formatted: string  value: bigint  }  }>  status: 'idle' | 'error' | 'loading' | 'success' }

Configuration

address (optional)

Address of ERC-20 token. If address is not defined, hook will not run.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',  }) }

chainId (optional)

Force a specific chain id for the request. The wagmi Client's publicClient must be set up as a chain-aware function for this to work correctly.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  chainId: 1,  }) }

cacheTime (optional)

Time (in ms) which the data should remain in the cache. Defaults to 0.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  cacheTime: 2_000,  }) }

enabled (optional)

Set this to false to disable this query from automatically running. Defaults to true.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  enabled: false,  }) }

formatUnits (optional)

Formats fee data. Defaults to ether.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',  formatUnits: 'gwei',  }) }

scopeKey (optional)

Scopes the cache to a given context. Hooks that have identical context will share the same cache.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  scopeKey: 'wagmi',  }) }

staleTime (optional)

Time (in ms) after data is considered stale. If set to Infinity the data will never be considered stale. Defaults to 1000 * 60 * 60 * 24 (24 hours).

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  staleTime: 2_000,  }) }

suspense (optional)

Set this to true to enable suspense mode.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  suspense: true,  }) }

onSuccess (optional)

Function to invoke when fetching new data is successful.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  onSuccess(data) {  console.log('Success', data)  },  }) }

onError (optional)

Function to invoke when an error is thrown while fetching new data.

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  onError(error) {  console.log('Error', error)  },  }) }

onSettled (optional)

Function to invoke when fetching is settled (either successfully fetched, or an error has thrown).

import { useToken } from 'wagmi'   function App() {  const token = useToken({  address: '0xc18360217d8f7ab5e7c516566761ea12ce7f9d72',  onSettled(data, error) {  console.log('Settled', { data, error })  },  }) }