模態鉤子

通過鉤子以程式化方式打開模態

以下鉤子允許在應用程式的任何地方以程式化方式打開模態。

useConnectModal
useAccountModal
useChainModal

這些鉤子中的每一個都返回一個帶有函數的物件，用於打開其各自的模態。請注意，如果您的應用程式未處於模態可以開啟所需的狀態，則返回的函數將為未定義。

import {
  useConnectModal,
  useAccountModal,
  useChainModal,
} from '@rainbow-me/rainbowkit';

export const YourApp = () => {
  const { openConnectModal } = useConnectModal();
  const { openAccountModal } = useAccountModal();
  const { openChainModal } = useChainModal();

  return (
    <>
      {openConnectModal && (
        <button onClick={openConnectModal} type="button">
          Open Connect Modal
        </button>
      )}

      {openAccountModal && (
        <button onClick={openAccountModal} type="button">
          Open Account Modal
        </button>
      )}

      {openChainModal && (
        <button onClick={openChainModal} type="button">
          Open Chain Modal
        </button>
      )}
    </>
  );
};

每個鉤子還會返回一個布林值來表示模態的狀態。通常建議您純粹依賴 Wagmi 鉤子（即 useAccount）來直接對用戶的錢包連接狀態做出反應，而不是依賴於連接模態的狀態。

const { connectModalOpen } = useConnectModal();
const { accountModalOpen } = useAccountModal();
const { chainModalOpen } = useChainModal();

RainbowKit 被設計為不打擾且具有響應性，因此 dApp 應始終為用戶呈現界面，無論他們是否已連接其錢包。用戶可以直接從 MetaMask 連接或斷開其錢包，因此 dApp 必須直接對基礎連接狀態做出響應。

依賴於以太坊登錄進行用戶驗證的 dApp，應改為依賴身份驗證功能。

概述

入門指南

進階

模態鉤子

通過鉤子以程式化方式打開模態