<WalletProvider>

<WalletProvider> 是嵌入式钱包的 React context provider。

示例

// src/index.tsx
import { createWallet } from '@money-sdk/core'
import { WalletProvider } from '@money-sdk/react'

const wallet = createWallet(/* ... */)

function Root() {
  return (
    <WalletProvider wallet={wallet}>
      <App />
    </WalletProvider>
  )
}

参考

props.wallet

由 createWallet 返回的、已初始化的钱包。

Hooks

以下 hook 从 @money-sdk/react 导出，必须在 <WalletProvider> 内部调用：

useWallet()

返回传入 provider 的 Wallet 实例。当你需要在组件外部调用 getProvider、disconnect 或 experimental_expand 等方法时使用它。

import { useWallet } from '@money-sdk/react'

function ConnectButton() {
  const wallet = useWallet()

  const handleClick = async () => {
    const solana = await wallet.getProvider('solana')
    await solana?.connect()
  }

  return <button onClick={handleClick}>Connect</button>
}

useConnected()

返回一个 boolean，表示用户是否已将钱包连接到你的 dApp。适合用来 控制 UI 的显示：

import { useConnected } from '@money-sdk/react'

function App() {
  const connected = useConnected()

  return connected ? <Dashboard /> : <Landing />
}

useObservable(observable)

用于订阅钱包实例所暴露的内部 observable 的低层 hook。通常你不需要 直接使用它 —— 对于连接状态，优先使用 useConnected。