useContract

Hook for connecting to a smart contract.

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

Usage

Provide your smart contract address as the first parameter. The second parameter is contract type; which is strongly recommended if your contract is a prebuilt contract, but not required.

Once connected, contract will be an instance of your smart contract.

The ABI is resolved automatically from our on-chain registry.

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

function App() {
  const { contract, isLoading, error } = useContract("{{contract_address}}");
}

Import Smart Contracts

If your smart contract was not deployed using thirdweb, you’ll need to import it on the dashboard.

Demo

function App() {
  const { contract, isLoading, error } = useContract(
    "0x083cc9b849E1A8CfEb6736654BF7ac5a98f81a6"
  );

  if (isLoading) {
    return <div>Loading...</div>;
  }

  if (error || !contract) {
    return <div>Error: {error.message}</div>;
  }

  return (
    <div>
      <h1>Contract</h1>
      <p>Connected to contract:</p>
      <pre>{contract.getAddress()}</pre>
    </div>
  );
}

Configuration

Contract Type (optional)

If your contract is a prebuilt contract, it is strongly recommended you provide the contract's name to gain access to improved top-level functions and type inference.

View available contract types

• NFT Drop: "nft-drop"
• Signature Drop: "signature-drop"
• Edition Drop: "edition-drop"
• NFT Collection: "nft-collection"
• Edition: "edition"
• Multiwrap: "multiwrap"
• Pack: "pack"
• Token Drop: "token-drop"
• Token: "token"
• Marketplace: "marketplace" | "marketplace-v3"
• Split: "split"
• Vote: "vote"

const { contract, isLoading, error } = useContract(
  "{{contract_address}}",
  "contract-type",
);