⚡

OnchainKit链上开发 onchainkit

OnchainKit 是 Coinbase 提供的 React 组件库，用于快速构建链上（Onchain）应用程序。该技能专注于 Web3 和 DApp 开发，提供钱包连接、身份管理、代币兑换、NFT 铸造和支付处理等核心功能模块。开发者无需深厚区块链后端知识，即可利用其预置组件高效开发部署在 Base 等链上的去中心化应用，显著降低开发门槛和交易成本。关键词：OnchainKit, 链上应用, Web3开发, DApp, React组件, Coinbase, 钱包集成, 代币兑换, NFT, 区块链开发。

DApp开发 0 次安装 0 次浏览 更新于 3/5/2026

name: onchainkit description: “使用 Coinbase 的 OnchainKit React 组件构建链上应用 - 钱包、兑换、NFT、支付” command: onchainkit emoji: “🔗”

OnchainKit - 构建链上应用

使用 Coinbase 的 React 组件库构建生产就绪的链上应用程序。

概述

OnchainKit 提供开箱即用的组件，以抽象化区块链的复杂性：

  • 无需后端基础设施
  • 在 Base 链上自动运行
  • 经济高效的交易（手续费 < 0.01 美元）

命令

项目设置

/onchainkit create <项目名称>    创建新的链上应用
/onchainkit add <组件>          向项目添加组件

模板

/onchainkit template wallet      钱包连接模板
/onchainkit template swap        代币兑换应用模板
/onchainkit template nft         NFT 铸造模板
/onchainkit template checkout    支付处理模板

文档

/onchainkit docs wallet          钱包集成文档
/onchainkit docs identity        身份组件文档
/onchainkit docs swap            代币兑换文档
/onchainkit docs transaction     交易构建文档

核心组件

钱包连接

import { Wallet, ConnectWallet } from '@coinbase/onchainkit/wallet';
<Wallet><ConnectWallet /></Wallet>

身份显示

import { Identity, Avatar, Name } from '@coinbase/onchainkit/identity';
<Identity address={address}><Avatar /><Name /></Identity>

代币兑换

import { Swap, SwapButton } from '@coinbase/onchainkit/swap';
<Swap><SwapButton /></Swap>

快速开始

# 创建新应用
npm create onchain@latest

# 或添加到现有项目
npm install @coinbase/onchainkit

配置

export NEXT_PUBLIC_CDP_API_KEY="..."        # Coinbase API 密钥
export NEXT_PUBLIC_WC_PROJECT_ID="..."      # WalletConnect 项目 ID

资源