useTransferNFT

Hook for transferring ERC721 or ERC1155 NFTs to another wallet address.

Available to use on contracts that implement either the ERC721 and ERC1155 interfaces, such as the Edition or NFT Collection.

The wallet address that initiates this transaction must have transfer permissions on the contract (i.e. the tokens are not soulbound). It also must have the required amount of token(s) available to transfer.

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

Usage

Provide your NFT contract instance as the argument to the hook.

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

// Your NFT collection contract address
const contractAddress = "{{contract_address}}";
const walletAddress = "{{wallet_address}}";
const tokenId = "{{token_id}}";

function App() {
  // Contract must be an ERC-721 or ERC-1155 contract
  const { contract } = useContract(contractAddress);
  const {
    mutateAsync: transferNFT,
    isLoading,
    error,
  } = useTransferNFT(contract);

  return (
    <Web3Button
      contractAddress={contractAddress}
      action={() =>
        transferNFT({
          to: walletAddress, // Address to transfer the token to
          tokenId: tokenId, // Token ID to transfer
        })
      }
    >
      Transfer
    </Web3Button>
  );
}

Configuration

to (required)

The wallet address to transfer the token(s) to.

To use the connected wallet address, use the useAddress hook.

import {
  useContract,
  useTransferNFT,
  Web3Button,
  useAddress,
} from "@thirdweb-dev/react";

const contractAddress = "{{contract_address}}";
const tokenId = "{{token_id}}";

function App() {
  // Contract must be an ERC-721 or ERC-1155 contract
  const { contract } = useContract(contractAddress);
  const {
    mutateAsync: transferNFT,
    isLoading,
    error,
  } = useTransferNFT(contract);
  const address = useAddress();

  return (
    <Web3Button
      contractAddress={contractAddress}
      action={() =>
        transferNFT({
          to: address, // Address to transfer the token to
          tokenId: tokenId, // Token ID to transfer
        })
      }
    >
      Transfer
    </Web3Button>
  );
}

tokenId (required)

The token ID of the NFT to transfer.

Can be a string or number.

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

const contractAddress = "{{contract_address}}";
const walletAddress = "{{wallet_address}}";
const tokenId = "{{token_id}}";

function App() {
  // Contract must be an ERC-721 or ERC-1155 contract
  const { contract } = useContract(contractAddress);
  const {
    mutateAsync: transferNFT,
    isLoading,
    error,
  } = useTransferNFT(contract);

  return (
    <Web3Button
      contractAddress={contractAddress}
      action={() =>
        transferNFT({
          to: walletAddress, // Address to transfer the token to
          tokenId: tokenId, // Token ID to transfer
        })
      }
    >
      Transfer
    </Web3Button>
  );
}

amount (ERC1155 only)

If you are using an ERC1155 contract, specify the amount of tokens to transfer.

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

const contractAddress = "{{contract_address}}";
const walletAddress = "{{wallet_address}}";
const tokenId = "{{token_id}}";
const amount = "{{amount}}"; // string or number

function App() {
  // Contract must be an ERC-721 or ERC-1155 contract
  const { contract } = useContract(contractAddress);
  const {
    mutateAsync: transferNFT,
    isLoading,
    error,
  } = useTransferNFT(contract);

  return (
    <Web3Button
      contractAddress={contractAddress}
      action={() =>
        transferNFT({
          to: walletAddress, // Address to transfer the token to
          tokenId: tokenId, // Token ID to transfer
          amount: amount, // Amount of tokens to transfer (ERC-1155 only)
        })
      }
    >
      Transfer
    </Web3Button>
  );
}