Rainbow logo
RainbowKit
2.2.10

เชน

เชน

การปรับแต่งเชน

RainbowKit ถูกออกแบบมาให้รวมเข้ากับออบเจกต์ chain ของ wagmi ตรวจสอบรายการเชนที่รองรับได้ ที่นี่

โดยค่าเริ่มต้น RainbowKit จะเชื่อมต่อกับเชนแรกที่จัดหาให้กับ Wagmi พฤติกรรมนี้สามารถปรับแต่งได้ผ่าน prop initialChain

เชนเริ่มต้นสามารถกำหนดค่าได้โดยใช้ chain ID

<RainbowKitProvider initialChain={1}>

เพื่อความสะดวก คุณยังสามารถส่งออบเจกต์เชนได้อีกด้วย

<RainbowKitProvider initialChain={mainnet}>

ไอคอนและพื้นหลังเชนหลายตัวถูกจัดเตรียมไว้ให้โดยค่าเริ่มต้น แต่คุณสามารถปรับแต่งไอคอนและพื้นหลังสำหรับแต่ละเชนโดยใช้พารามิเตอร์ iconUrl และ iconBackground

ตัวอย่างด้วย getDefaultConfig

import { mainnet, optimism } from 'wagmi/chains';
const config = getDefaultConfig({
chains: [
{
...mainnet,
iconBackground: '#000',
iconUrl: 'https://example.com/icons/ethereum.png',
},
{
...optimism,
iconBackground: '#ff0000',
iconUrl: 'https://example.com/icons/optimism.png',
},
],
});

ตัวอย่างด้วย createConfig

import { mainnet, optimism } from 'wagmi/chains';
import { Chain } from '@rainbow-me/rainbowkit';
const chains: readonly [Chain, ...Chain[]] = [
{
...mainnet,
iconBackground: '#000',
iconUrl: 'https://example.com/icons/ethereum.png',
},
{
...optimism,
iconBackground: '#ff0000',
iconUrl: 'https://example.com/icons/optimism.png',
},
];
const config = createConfig({
chains,
});