@ 连接- xyz/ 退出- react

一个能使前端反应应用程序能与Connect Reaction产品无缝地相接的SDK.

连接退出为终端用户提取资金提供了一个安全的途径. 学多一点 连接撤回文档。 。 。 .

所需资源

• 反应18.0.0或以上
• 反应DOM 18.0.0或以上

安装

npm install @connect-xyz/withdraw-react

开始

遵循这些简单的步骤, 将退出整合到您的 React 应用程序中 :

1. 进口撤回部分

import { Withdraw } from '@connect-xyz/withdraw-react';

2. 在您的应用程序中添加撤回组件

function App() {
  const jwt = 'your-jwt-token'; // Obtain this from your backend authentication

  return (
    <Withdraw
      jwt={jwt}
      env="production" // or "sandbox" for testing
    />
  );
}

3. 配置事件召回(可选)

听从撤销 SDK 的事件处理用户交互 :

function App() {
  const jwt = 'your-jwt-token';

  const handleError = ({ errorCode, reason }) => {
    console.log('Withdraw error occurred:', errorCode, 'Reason:', reason);
  };

  const handleClose = () => {
    console.log('Withdraw widget closed');
  };

  const handleWithdrawal = ({ data }) => {
    console.log('Withdrawal data:', data);
  };

  const handleEvent = ({ type, data }) => {
    console.log('Withdraw event:', type, 'Data:', data);
  };

  const handleLoaded = () => {
    console.log('Withdraw widget loaded and ready');
  };

  return (
    <Withdraw
      jwt={jwt}
      env="production"
      onError={handleError}
      onClose={handleClose}
      onWithdrawal={handleWithdrawal}
      onEvent={handleEvent}
      onLoaded={handleLoaded}
    />
  );
}

关于召回事件及其有效载荷的详情,见 连接 SDKs 调用文档。 。 。 .

完整示例

以下是将 Connect request 整合到您的 React 应用程序的完整实例 :

import { Withdraw } from '@connect-xyz/withdraw-react';
import React from 'react';

function App() {
  // JWT token should be obtained from your backend
  const jwt = 'your-jwt-token';

  // Choose environment: "production" for live apps, "sandbox" for testing
  const environment = 'production';

  return (
    <div className="App">
      <h1>My Crypto App</h1>

      <Withdraw
        jwt={jwt}
        env={environment}
        onError={({ errorCode, reason }) => {
          console.log('Error:', errorCode, 'Reason:', reason);
        }}
        onClose={() => {
          console.log('Withdraw widget closed');
        }}
        onWithdrawal={({ data }) => {
          console.log('Withdrawal successful:', data);
        }}
        onEvent={({ type, data }) => {
          console.log('Event type:', type, 'Event data:', data);
        }}
        onLoaded={() => {
          console.log('Withdraw widget loaded and ready');
        }}
      />
    </div>
  );
}

export default App;

API 参考

撤销组件道具

更多信息与支持

关于Connect撤回的全面文件或支持,请访问 页 次。 。 。 .