NFTCard
Components used to display NFTCard.
Basic Usage
#16
Preview
My NFT
This is description
1.23 ETH
1.6k
Preview
No:16
My NFT
This is description
1.23 ETH
1.6k
Dark Mode
#16
Preview
My NFT
This is description
1.23 ETH
1.6k
Preview
No:16
My NFT
This is description
1.23 ETH
1.6k
Use with wagmi
#42
Error Handling
#42
#42
#16
Preview
My NFT
This is description
API
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| address | The address of the NFT. For Bitcoin, it is the inscription id or inscription number. | string | - | - |
| tokenId | The tokenId of the NFT | number | bigint | - | - |
| getNFTMetadata | The method to get the metadata of the NFT | (address: string, tokenId?: number | bigint) => Promise<NFTMetadata> | - | - |
| actionText | The text of the main button in the card | React.ReactNode | 'Buy Now' | - |
| antdImageProps | The props of antd Image component | ImageProps | - | - |
| className | The className of the card | string | - | - |
| description | The description of the card | React.ReactNode | - | - |
| image | The image of the card | string | React.ReactNode | - | - |
| like | The props of like | LikeProps | - | - |
| price | Asset price | CryptoPriceProps | - | - |
| footer | The footer of the card | React.ReactNode | - | - |
| name | The name of the card | string | - | - |
| style | The style of the card | React.CSSProperties | - | - |
| showAction | Whether to show the action button of the card | boolean | true | - |
| type | The type of the card | 'default' | 'pithy' | 'default' | - |
| onActionClick | The callback when the action button of the card is clicked | () => void | - | - |
| errorRender | Rendering method for displaying exception information when NFT gets an exception | (error: Error) => React.ReactNode | - | - |
| locale | Multilingual settings | Locale["NFTCard"] | - | - |
The definition of NFTMetadata refers to the Ethereum ERC721 standard, see NFTMetadata document for details.
LikeProps
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| liked | Whether the card is liked | boolean | - | - |
| totalLikes | The total number of likes | number | - | - |
| onLikeChange | The callback when the like status changes | (isLike: boolean) => void | - | - |