ConnectButton
连接区块链钱包的按钮。通常来说，你需要配合 Connector 组件使用。
注：本文档中的示例仅仅是纯 UI 的示例，在 Ant Design Web3 中。UI 模块和连接模块是分离的。要想真正的连接钱包，请参考以太坊适配器的文档，或阅读适配器文档了解更多。
基本使用
快速连接
配置了 quickConnect 属性后，会在按钮上直接展示已安装的钱包和通用协议（比如 WalletConnect）的钱包。
展示提示
可选择链
展示菜单
展示信息弹框
头像
显示名称
不同类型的按钮
图标
余额
API
| 属性 | 描述 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| account | 当前连接账号 | Account | - | - |
| tooltip | 鼠标移入地址时展示提示 | boolean | ConnectButtonTooltipProps | false | - |
| actionsMenu | 配置菜单项 | boolean | ActionsMenu | - | - |
| profileModal | 配置信息弹框 | boolean | ProfileModal | - | - |
| avatar | 配置头像，用于在个人信息弹框中展示用户头像 | AvatarProps | - | - |
| onMenuItemClick | 菜单项点击事件 | (e: NonNullable<MenuProps['items']>[number]) => void | - | - |
| balance | 余额 | Balance | - | - |
| availableChains | 可以连接的链列表 | Chain[] | - | - |
| availableWallets | 可用的钱包列表 | Wallet[] | - | - |
| quickConnect | 快速连接钱包 | boolean | false | - |
| locale | 多语言设置 | Locale["ConnectButton"] | - | - |
| chainSelect | 是否显示选择链 | boolean | true | - |
Balance
| 属性 | 描述 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| value | 余额 | bigint | number | - | - |
| symbol | 代币符号 | string | - | - |
| decimals | 代币精度 | number | - | - |
| coverAddress | 覆盖地址 | boolean | true | - |
ConnectButtonTooltipProps
| 属性 | 描述 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| copyable | 是否可复制 | boolean | - | - |
| title | 展示内容 | boolean | string | React.ReactNode | - | - |
| format | 格式化展示内容 | boolean | (address: string) => React.ReactNode | - | - |
更多属性继承自 Ant Design 的 Tooltip 组件，你可以查看组件文档了解更多。
ActionsMenu
| 属性 | 描述 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| extraItems | 额外菜单 | MenuItemType[] | - | - |
更多属性继承自 Ant Design 的 Menu 组件，你可以查看组件文档了解更多。
ProfileModal
ProfileModal 属性继承自 Ant Design 的 Modal 组件，你可以查看组件文档了解更多。