thirdwebDocs

useReadContract

Signature#1

A hook to read state from a contract that automatically updates when the contract changes.

You can use raw read calls or read extensions to read from a contract.

Example

import { getContract } from "thirdweb";
import { sepolia } from "thirdweb/chains";
import { useReadContract } from "thirdweb/react";
 
const contract = getContract({
  client,
  address: "0x...",
  chain: sepolia,
});
 
const { data, isLoading } = useReadContract({
  contract,
  method: "function tokenURI(uint256 tokenId) returns (string)"});
  params: [1n],
});
function useReadContract(
  options: { contract: Readonly<ContractOptions<abi>> } & Omit<
    TransactionRequest,
    | "value"
    | "from"
    | "to"
    | "gas"
    | "accessList"
    | "data"
    | "gasPrice"
    | "maxFeePerGas"
    | "maxPriorityFeePerGas"
    | "nonce"
  > & {
      from?: string;
      method: method | PreparedMethod<ParseMethod<abi, method>>;
    } & ParamsOption<
      ParseMethod<ParseMethod<abi, method>>["inputs"]
    > &
    Omit<
      "client" | "chain" | "to" | "data"
    > & { queryOptions?: PickedQueryOptions },
): UseQueryResult<
  ReadContractResult<PreparedMethod<ParseMethod<abi, method>>[2]>
>;

Parameters

The options for reading from a contract

Type

let options: { contract: Readonly<ContractOptions<abi>> } & Omit<
  TransactionRequest,
  | "value"
  | "from"
  | "to"
  | "gas"
  | "accessList"
  | "data"
  | "gasPrice"
  | "maxFeePerGas"
  | "maxPriorityFeePerGas"
  | "nonce"
> & {
    from?: string;
    method: method | PreparedMethod<ParseMethod<abi, method>>;
  } & ParamsOption<ParseMethod<ParseMethod<abi, method>>["inputs"]> &
  Omit<
    "client" | "chain" | "to" | "data"
  > & { queryOptions?: PickedQueryOptions };

Returns

let returnType: UseQueryResult<
  ReadContractResult<PreparedMethod<ParseMethod<abi, method>>[2]>
>;

a UseQueryResult object.

Signature#2

A hook to read state from a contract that automatically updates when the contract changes. You can use raw read calls or read extensions to read from a contract.

Example

Read a contract extension let you do complex contract queries with less code.

import { useReadContract } from "thirdweb/react";
import { getOwnedNFTs } form "thirdweb/extensions/erc721";
 
const { data, isLoading } = useReadContract(getOwnedNFTs, { contract, owner: address });
function useReadContract(
  extension: (
    options: BaseTransactionOptions<params, abi>,
  ) => Promise<result>,
  options: { contract: Readonly<ContractOptions<abi>> } & params & {
      queryOptions?: PickedQueryOptions;
    },
): UseQueryResult<result>;

Parameters

An extension to call.

Type

let extension: (
  options: BaseTransactionOptions<params, abi>,
) => Promise<result>;

The read extension params.

Type

let options: { contract: Readonly<ContractOptions<abi>> } & params & {
    queryOptions?: PickedQueryOptions;
  };

Returns

let returnType: UseQueryResult<result>;

a UseQueryResult object.