Rainbow logo
RainbowKit
2.2.10

Cangkuk Modal

Cangkuk Modal

Buka modals secara programatik melalui Cangkuk

Cangkuk berikut disediakan untuk membolehkan pembukaan programatik modals di mana-mana dalam aplikasi anda.

  • useConnectModal
  • useAccountModal
  • useChainModal

Setiap Cangkuk ini mengembalikan objek dengan fungsi untuk membuka modalnya masing-masing. Perhatikan bahawa fungsi yang dikembalikan akan menjadi undefined jika aplikasi anda tidak berada dalam keadaan yang diperlukan untuk modal dibuka.

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

Setiap cangkuk juga mengembalikan boolean untuk status modal. Secara umumnya disyorkan agar anda bergantung sepenuhnya pada cangkuk Wagmi (iaitu useAccount) untuk bertindak balas terhadap status sambungan dompet pengguna secara langsung, daripada bergantung pada keadaan Modal Sambung.

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

RainbowKit direka untuk tidak mengganggu dan responsif, jadi dApps harus sentiasa memaparkan antara muka untuk pengguna tanpa mengira sama ada mereka telah menyambung dompet mereka atau tidak. Seorang pengguna boleh menyambung atau memutuskan sambungan dompet mereka secara langsung dari MetaMask, jadi dApp mesti responsif kepada status sambungan asas secara langsung.

dApps yang bergantung pada mekanisme seperti Daftar masuk dengan Ethereum untuk pengesahan pengguna sebaliknya harus bergantung pada ciri Authentication.