Rainbow logo
RainbowKit
2.2.0

체인

체인

체인 커스터마이징

RainbowKit은 wagmi의 chain 객체와 통합되도록 설계되었습니다. [here]의 지원되는 체인 목록을 확인하세요. (https://wagmi.sh/react/chains#supported-chains)

기본적으로, RainbowKit은 Wagmi에 제공된 첫 번째 체인에 연결됩니다. 이 동작은 initialChain 속성을 통해 사용자 정의할 수 있습니다.

초기 체인은 체인 ID를 사용하여 구성할 수 있습니다.

<RainbowKitProvider initialChain={1}>

편의를 위해 체인 객체를 전달할 수도 있습니다.

<RainbowKitProvider initialChain={mainnet}>

기본적으로 여러 체인 아이콘과 배경이 제공되지만, 각 체인의 아이콘과 배경은 iconUrliconBackground 속성을 사용하여 사용자 정의할 수 있습니다.

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,
});