รายการกระเป๋าเงินที่กำหนดเอง
รายการกระเป๋าเงินที่กำหนดเอง
การปรับแต่งรายการกระเป๋าเงิน
คุณสามารถนำเข้ากระเป๋าเงินแต่ละชนิดจาก '@rainbow-me/rainbowkit/wallets' พร้อมกับฟังก์ชัน connectorsForWallets เพื่อสร้างรายการกระเป๋าเงินของคุณพร้อมตัวเชื่อมต่อที่จำเป็นได้ ด้วยวิธีนี้คุณมีการควบคุมเต็มที่เกี่ยวกับว่าจะให้แสดงกระเป๋าเงินอะไรบ้างและในลำดับใด.
ตัวอย่างเช่น คุณสามารถเลือกที่จะแสดงเฉพาะ Rainbow พร้อมกับกระเป๋าเงินสำรองทั่วไปได้.
import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
rainbowWallet,
walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';
const connectors = connectorsForWallets(
[
{
groupName: 'Recommended',
wallets: [rainbowWallet, walletConnectWallet],
},
],
{
appName: 'My RainbowKit App',
projectId: 'YOUR_PROJECT_ID',
}
);
จากนั้นคุณสามารถส่งต่อเข้าตัวเชื่อมต่อของคุณไปยังการกำหนดค่า createConfig ของ Wagmi ได้.
import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import { createConfig } from 'wagmi';
const connectors = connectorsForWallets();
const config = createConfig({
connectors,
{}
});
const queryClient = new QueryClient();
const App = () => (
<WagmiProvider config={config}>
<QueryClientProvider client={queryClient}>
<RainbowKitProvider {...etc}>
{}
</RainbowKitProvider>
</QueryClientProvider>
</WagmiProvider>
);
กระเป๋าเงินต่อไปนี้ให้ผ่านทางวัตถุ wallet.
กระเป๋าเงินต่อไปนี้มีขอบเขตเชื่อมต่อทั่วไปอย่างไม่เฉพาะเจาะจงไปยังแอฟพลิเคชัน ทำให้แนะนำว่ากระเป๋าเหล่านี้ควรรวมอยู่ด้วยเสมอ.
นี่คือทางเลือกแบบ fallback สำหรับกระเป๋าเงินที่ใช้ WalletConnect ซึ่งยังไม่ได้มีการให้ผ่านกระเป๋าเงินอื่นในรายการ.
ขอแนะนำให้คุณรวมกระเป๋านี้ไว้ในรายการเพื่อให้แน่ใจว่ากระเป๋าที่ใช้ WalletConnect ได้รับการสนับสนุนทั้งหมด.
import { walletConnectWallet } from '@rainbow-me/rainbowkit/wallets';
นี่คือทางเลือกกระเป๋าเงิน fallback สำหรับสถานการณ์ที่มี window.ethereum แต่ยังไม่ได้รับการให้ผ่านกระเป๋าเงินอื่นในรายการ ซึ่งกระเป๋าเงินนี้จะซ่อนตัวเองจากรายการอัตโนมัติ ถ้าการ fallback ไม่มีความจำเป็นหรือไม่มีกระเป๋าเงินที่ถูกฉีดเข้ามา.
ขอแนะนำให้คุณรวมกระเป๋านี้ไว้ในรายการเพื่อให้แน่ใจว่ากระเป๋าเงินที่ถูกฉีดเข้ามาได้รับการสนับสนุนทั้งหมด.
import { injectedWallet } from '@rainbow-me/rainbowkit/wallets';
สำหรับ dApps ที่สนับสนุน Safe Apps เพื่อให้ผู้ใช้สามารถเชื่อมต่อกับ Safe vault หรือ multi-sig ของตัวเองได้ง่ายๆ ให้รวมตัวเลือก safeWallet สำหรับการเชื่อมต่ออัตโนมัติ ตัวเลือก Safe จะปรากฏในสภาพแวดล้อมเบราว์เซอร์ของ Safe Wallet เท่านั้น.
import { safeWallet } from '@rainbow-me/rainbowkit/wallets';
กระเป๋าเงินต่อไปนี้ให้ผ่านทางวัตถุ wallet (ในลำดับตัวอักษร).
import { oneInchWallet } from '@rainbow-me/rainbowkit/wallets';
import { backpackWallet } from '@rainbow-me/rainbowkit/wallets';
ตัวเชื่อมกระเป๋าเงินนี้รองรับบัญชีพื้นฐาน พัฒนาการใหม่ของกระเป๋าเงิน Coinbase อัจฉริยะ มอบการตรวจสอบสิทธิ์ที่ไม่มีสะดุดและฟีเจอร์เพิ่มเติม เช่น บัญชีย่อยและการอนุญาตการใช้จ่าย
ตัวเลือกการกำหนดค่าเข้ากันได้กับ เอกสารอ้างอิง Base Account SDK
import { baseAccount } from '@rainbow-me/rainbowkit/wallets';
baseAccount.preference = {
attribution: { auto: true },
};
baseAccount.preference = {
attribution: { dataSuffix: '0x1234567890abcdef' },
};
baseAccount.subAccounts = {
creation: 'on-connect',
defaultAccount: 'sub',
funding: 'spend-permissions',
};
baseAccount.paymasterUrls = {
[base.id]: 'https://api.developer.coinbase.com/rpc/v1/base/...',
};
import { berasigWallet } from '@rainbow-me/rainbowkit/wallets';
import { bestWallet } from '@rainbow-me/rainbowkit/wallets';
import { bifrostWallet } from '@rainbow-me/rainbowkit/wallets';
import { binanceWallet } from '@rainbow-me/rainbowkit/wallets';
import { bitgetWallet } from '@rainbow-me/rainbowkit/wallets';
import { bitskiWallet } from '@rainbow-me/rainbowkit/wallets';
import { bitverseWallet } from '@rainbow-me/rainbowkit/wallets';
import { bloomWallet } from '@rainbow-me/rainbowkit/wallets';
import { braveWallet } from '@rainbow-me/rainbowkit/wallets';
import { bybitWallet } from '@rainbow-me/rainbowkit/wallets';
import { coin98Wallet } from '@rainbow-me/rainbowkit/wallets';
import { compassWallet } from '@rainbow-me/rainbowkit/compassWallet';
import { coreWallet } from '@rainbow-me/rainbowkit/wallets';
import { ctrlWallet } from '@rainbow-me/rainbowkit/wallets';
import { dawnWallet } from '@rainbow-me/rainbowkit/wallets';
import { enkryptWallet } from '@rainbow-me/rainbowkit/wallets';
import { foxWallet } from '@rainbow-me/rainbowkit/wallets';
import { frameWallet } from '@rainbow-me/rainbowkit/wallets';
import { frontierWallet } from '@rainbow-me/rainbowkit/wallets';
import { gateWallet } from '@rainbow-me/rainbowkit/wallets';
ตัวเชื่อมต่อกระเป๋าอัจฉริยะนี้ช่วยให้การตรวจสอบสิทธิ์เป็นไปอย่างราบรื่นผ่านคีย์ผ่านที่ keys.gemini.com โดยไม่ต้องดาวน์โหลด ไม่มีส่วนขยายหรือคีย์ API ที่จำเป็น ใช้งานได้ทันที
พารามิเตอร์ appName จำเป็นสำหรับการระบุ dApp ของคุณ และ appIcon เป็นตัวเลือกสำหรับการสร้างแบรนด์ประสบการณ์การเชื่อมต่อของคุณ
import { geminiWallet } from '@rainbow-me/rainbowkit/wallets';
const gemini = geminiWallet({
appName: 'My App',
appIcon: 'https://my-app.com/logo.png',
});
import { imTokenWallet } from '@rainbow-me/rainbowkit/wallets';
import { iopayWallet } from '@rainbow-me/rainbowkit/wallets';
import { kaiaWallet } from '@rainbow-me/rainbowkit/wallets';
import { kaikasWallet } from '@rainbow-me/rainbowkit/wallets';
import { krakenWallet } from '@rainbow-me/rainbowkit/wallets';
import { kresusWallet } from '@rainbow-me/rainbowkit/wallets';
import { ledgerWallet } from '@rainbow-me/rainbowkit/wallets';
import { magicEdenWallet } from '@rainbow-me/rainbowkit/wallets';
import { metaMaskWallet } from '@rainbow-me/rainbowkit/wallets';
import { mewWallet } from '@rainbow-me/rainbowkit/wallets';
import { novaWallet } from '@rainbow-me/rainbowkit/wallets';
import { okxWallet } from '@rainbow-me/rainbowkit/wallets';
import { omniWallet } from '@rainbow-me/rainbowkit/wallets';
import { oneKeyWallet } from '@rainbow-me/rainbowkit/wallets';
import { paraSwapWallet } from '@rainbow-me/rainbowkit/wallets';
import { phantomWallet } from '@rainbow-me/rainbowkit/wallets';
import { portoWallet } from '@rainbow-me/rainbowkit/wallets';
import { rabbyWallet } from '@rainbow-me/rainbowkit/wallets';
import { rainbowWallet } from '@rainbow-me/rainbowkit/wallets';
import { ramperWallet } from '@rainbow-me/rainbowkit/wallets';
import { readyWallet } from '@rainbow-me/rainbowkit/wallets';
import { roninWallet } from '@rainbow-me/rainbowkit/wallets';
import { safeheronWallet } from '@rainbow-me/rainbowkit/wallets';
import { tahoWallet } from '@rainbow-me/rainbowkit/wallets';
import { talismanWallet } from '@rainbow-me/rainbowkit/wallets';
import { tokenaryWallet } from '@rainbow-me/rainbowkit/wallets';
import { tokenPocketWallet } from '@rainbow-me/rainbowkit/wallets';
import { trustWallet } from '@rainbow-me/rainbowkit/wallets';
import { uniswapWallet } from '@rainbow-me/rainbowkit/wallets';
import { valoraWallet } from '@rainbow-me/rainbowkit/wallets';
import { wigwamWallet } from '@rainbow-me/rainbowkit/wallets';
import { xPortalWallet } from '@rainbow-me/rainbowkit/wallets';
import { zerionWallet } from '@rainbow-me/rainbowkit/wallets';
import { zilPayWallet } from '@rainbow-me/rainbowkit/wallets';
นี่คือตัวอย่างการแสดงกระเป๋าเงินต่างๆ ในลำดับที่ต่างกัน.
แสดง MetaMask พร้อมกับกระเป๋าเงินสำรองทั่วไป.
import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
metaMaskWallet,
walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';
const connectors = connectorsForWallets(
[
{
groupName: 'Recommended',
wallets: [metaMaskWallet, walletConnectWallet],
},
],
{ appName: 'RainbowKit App', projectId: 'YOUR_PROJECT_ID' },
);
แสดง Rainbow, MetaMask และ Base Account พร้อมกับกระเป๋าเงิน fallback ทั่วไป
import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
rainbowWallet,
metaMaskWallet,
baseAccount,
walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';
const connectors = connectorsForWallets(
[
{
groupName: 'Suggested',
wallets: [
rainbowWallet,
metaMaskWallet,
baseAccount,
walletConnectWallet,
],
},
],
{ appName: 'RainbowKit App', projectId: 'YOUR_PROJECT_ID' },
);
เตือนความจำ: ลำดับของอาร์เรย์ 'wallets' กำหนดลำดับที่จะแสดงกระเป๋าเงินใน UI.
คุณสามารถใช้คีย์ groupName เพื่อรับชมกลุ่มกระเป๋าเงินที่แตกต่างกันได้ นี่เป็นประโยชน์ถ้าคุณต้องการสื่อให้ผู้ใช้ของคุณรู้ว่ากระเป๋าเงินไหนที่แนะนำใช้ได้พร้อมกับที่เป็นไปได้อื่นๆ.
แนะนำ Rainbow และ MetaMask แต่ยังเสนอ Base Account พร้อมกับกระเป๋าเงิน fallback ทั่วไป
import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import {
rainbowWallet,
metaMaskWallet,
baseAccount,
walletConnectWallet,
} from '@rainbow-me/rainbowkit/wallets';
const connectors = connectorsForWallets(
[
{
groupName: 'Recommended',
wallets: [rainbowWallet, metaMaskWallet],
},
{
groupName: 'Others',
wallets: [baseAccount, walletConnectWallet],
},
],
{ appName: 'RainbowKit App', projectId: 'YOUR_PROJECT_ID' },
);