catnips-sdk-react

CatnipsSDK 的 React 封装，提供自动加载和 React Hooks。

安装

npm install catnips-sdk-react

快速开始

1. 添加 Provider（可选）

在应用顶层放置 CatnipsSDKProvider 可以尽早开始加载 SDK：

import { CatnipsSDKProvider } from 'catnips-sdk-react'

function App() {
    return (
        <CatnipsSDKProvider>
            <YourApp />
        </CatnipsSDKProvider>
    )
}

2. 使用 Hooks

useCatnipsAuth — 用户认证

import { useCatnipsAuth } from 'catnips-sdk-react'

function UserProfile() {
    const { user, loading, isLoggedIn, login, logout } = useCatnipsAuth()

    if (loading) return <div>Loading...</div>

    if (!isLoggedIn) {
        return <button onClick={() => login()}>Login</button>
    }

    return (
        <div>
            <p>{user.email}</p>
            <button onClick={logout}>Logout</button>
        </div>
    )
}

useCatnipsSDK — 完整 SDK 访问

import { useCatnipsSDK } from 'catnips-sdk-react'

function MyComponent() {
    const { sdk, loading, error, reload } = useCatnipsSDK()

    if (loading) return <div>Loading SDK...</div>
    if (error) return <button onClick={reload}>Retry</button>

    // 使用 sdk.api, sdk.analytics 等
    return <div>SDK v{sdk.version}</div>
}

不依赖 React 的用法

import { loadCatnipsSDK, getCatnipsSDKSync, isSDKLoaded } from 'catnips-sdk-react'

// 异步加载
const sdk = await loadCatnipsSDK()
await sdk.api.get('/some-endpoint')

// 同步获取（SDK 未加载时返回 null）
const sdk = getCatnipsSDKSync()

// 检查是否已加载
if (isSDKLoaded()) {
    // ...
}

License

MIT