# @dexhunterio/swaps 中文文档

规范地址：https://npmcn.com/package/%40dexhunterio/swaps/

版本：2\.0\.5
npm 元数据更新时间：2026-05-13T09:59:31.868Z
中文译文更新时间：2026-11-12T12:42:13.192Z
软件包许可：未声明

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40dexhunterio/swaps
原文对照：https://npmcn.com/package/%40dexhunterio/swaps/?lang=original

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：2.5 MB，323 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：34 个
- peer 依赖：@radix-ui/react-accordion ^1\.1\.2 \|\| ^1\.2\.3，@radix-ui/react-checkbox ^1\.0\.4 \|\| ^1\.1\.4，@radix-ui/react-dialog ^1\.0\.4 \|\| ^1\.1\.6，@radix-ui/react-dropdown-menu ^2\.0\.5 \|\| ^2\.1\.6，@radix-ui/react-label ^2\.0\.2 \|\| ^2\.1\.2，@radix-ui/react-popover ^1\.0\.6 \|\| ^1\.1\.6，@radix-ui/react-progress 1\.0\.3，@radix-ui/react-separator ^1\.0\.3 \|\| ^1\.1\.2，@radix-ui/react-slider ^1\.1\.2 \|\| ^1\.2\.3，@radix-ui/react-slot ^1\.0\.2 \|\| ^1\.1\.2，@radix-ui/react-switch ^1\.0\.3 \|\| ^1\.1\.3，@radix-ui/react-toast ^1\.1\.4 \|\| ^1\.2\.6，@radix-ui/react-tooltip ^1\.0\.6 \|\| ^1\.1\.8，@tabler/icons-react ^2\.30\.0 \|\| ^3\.31\.0，@tanstack/react-query ^5\.59\.16 \|\| ^5\.67\.2，axios ^1\.7\.7 \|\| ^1\.8\.2，bech32 ^2\.0\.0，cbor-x ^1\.6\.0，class-variance-authority ^0\.7\.0 \|\| ^0\.7\.1，clsx ^2\.0\.0 \|\| ^2\.1\.1，immer ^10\.0\.2 \|\| ^10\.1\.1，lucide-react ^0\.263\.1 \|\| ^0\.479\.0，moment ^2\.29\.4 \|\| ^2\.30\.1，react ^18\.2\.0 \|\| ^19\.0\.0，react-currency-input-field ^3\.6\.11 \|\| ^3\.10\.0，react-dom ^18\.2\.0 \|\| ^19\.0\.0，react-hotkeys-hook ^4\.4\.1 \|\| ^4\.6\.1，react-spinners ^0\.13\.8 \|\| ^0\.15\.0，react-virtuoso ^4\.4\.2 \|\| ^4\.12\.3，tailwind-merge ^1\.14\.0，tailwindcss-animate ^1\.0\.6 \|\| ^1\.0\.7，use-debounce ^9\.0\.4 \|\| ^10\.0\.4，zustand ^4\.4\.0 \|\| ^5\.0\.3
- 首次发布：2023-10-19T11:36:38.420Z
- 最新版本发布：2026-05-13T09:59:31.702Z
- 近 30 天下载量：2504（2026-10-12 至 2026-11-10，npm 官方下载统计）
- 已发布版本数：179（近 12 个月 8 个）

## 中文简介

### 如何使用库( 用 React)

## 安装

```sh
npm install @dexhunterio/swaps
```

也可以使用：`pnpm add @dexhunterio/swaps`、`yarn add @dexhunterio/swaps`、`bun add @dexhunterio/swaps`

## README

# Dex Hunter - 交换组件

### 如何使用库( 用 React)

1.  安装软件包 :
    
    ```console
    npm i @dexhunterio/swaps
    ```
    
2.  导入到您的代码 2.1. 反应JS:
    
    ```js
      import '@dexhunterio/swaps/lib/assets/style.css'
      import Swap from '@dexhunterio/swaps'
      ...
    ```
    
    2.2. 下一期司法调查:
    
    ```js
    "use client";
    import '@dexhunterio/swaps/lib/assets/style.css'
    const Swap = dynamic(() => import("@dexhunterio/swaps"), {
        ssr: false,
    });
    ...
    ```
    
3.  使用交换组件 :
    
    ```js
    function App() {
      return (
        <div>
          <Swap {...settings} />
        </div>
      );
    }
    ```
    

### 如何使用库( 与 VanilaJS)

-   头部标记
    
    ```html
    <head>
      ...
      <script
        src="https://unpkg.com/react@18.2/umd/react.production.min.js"
        crossorigin
      ></script>
      <script
        src="https://unpkg.com/react-dom@18.2/umd/react-dom.production.min.js"
        crossorigin
      ></script>
      <script
        type="module"
        src="https://unpkg.com/@dexhunterio/swaps@0.0.95/lib/umd/swaps.umd.js"
      ></script>
      ...
    </head>
    ```
    
-   在身体标记中 :
    
    ```html
    ...
    <div id="dexhunter"></div>
    <script type="module">
      ReactDOM.render(
        React.createElement(dexhunterSwap, {
          orderTypes: ['SWAP', 'LIMIT', 'DCA'],
          theme: 'light',
        }),
        document.getElementById('dexhunter')
      );
    </script>
    ...
    ```
    

### 可用的道具 :

需要吗 |:相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也;相去也 默认 Token 虚构 QQ 字符串 QQ - 要选择的默认符号 。 | 宽度 虚度 px – 组件的宽度 。 接受像素值或百分比值 高度 假的 px – 组件的高度 。 接受像素值或百分比值 {\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}==================================================================================================================== 组成部分主题. 可以是"黑暗"或"光" QQ 命令 Types QQ 假 QQ 阵列 \['SWAP', 'LIMIT'\] QQ 由组件支持的顺序类型。 默认为“ SWAP” 和“ LIMIT ” 。 QQ -=YTET -伊甸园字幕组=- 翻译: 用于搜索的数组代号 。 @ @ info QQ伴侣Name 真实的QQ字符串 QQ - 合伙人名称. 这是一个需要的领域。 | =========== =================================================================================================================================================================================================================================================== 这是一个需要的领域。 | QQ 颜色 QQ 错误 QQ 对象 QQ - 支持的颜色 : `mainText`, (中文(简体) ), `subText`, (中文(简体) ), `background`, (中文(简体) ), `containers`, (中文(简体) ), `buttonText`, (中文(简体) ), `accent`。 。 。 QQ 类Name QQ 假的 CSS 类 。 | QQ 样式 QQ 虚构对象 QQ - 组件的内置样式 。 @ info 在SwapSuccess上 QQ虚假的QQ( 数据: 任何) 空虚 QQ - 成功互换时调回函数 。 @ @ info 在 SwapError 上 QQ 假的QQ( err: 任何) 虚空 QQ - 在互换错误时调回函数 。 @ @ @ info \* \* 选中的Wallet \* 虚假 \* 选中的Wallet \* - \* \* 用户选择的钱包 。 接受指定的钱包标识符之一。 支持的钱包 : `nami`, (中文(简体) ), `eternl`, (中文(简体) ), `flint`, (中文(简体) ), `gerowallet`, (中文(简体) ), `typhoncip30`, (中文(简体) ), `nufi`, (中文(简体) ), `lace`, (中文(简体) ), `vespr`, (中文(简体) ), `begin`,以及 `yoroi`。 。 。 QQ 输入 QQ 假的 QQ 字符串 \[\] - QQ 输入字段 在WalletConnect上 虚构的 QQ (数据: 任何) 无效的 QQ - 当钱包连接时调回函数 。 | 在 ClickWalletConnect 上,虚构的QQ () 空虚的QQ - 点击钱包连接按钮时触发的QQ 在ViewOrder上的QQ 假的QQ (数据: 任何) 虚空QQ - 点击查看命令按钮时触发QQ {\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}显示Type {\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}虚构的"BUTTON" `|` "拒绝" `|` “ WIDGET” QQ“ DEFAULT” 显示类型 QQ QQ 按钮文本 QQ 错误的 QQ 字符串 交换 QQ 按钮文本 当显示 Type = “ BUTTON ” 时 QQ ============================================================================================================================================================================== `|` "LIMIT" (英语) `|` “ DCA ” QQ“ SWAP ” 显示 Tab 时的默认 QQ 默认设置 QQ 错误 { is CustomSlippage? : boolean; is AutomaticSlippage? : boolean; slippage: number;} {} - 设置默认 {} \* 自动焦点 \* \* 假 \* \* 布尔 \* \* 假 \* \* \* 自动 专注于在页面装入 \* \* 时销售输入

## 常见问题

### @dexhunterio/swaps 是什么？

如何使用库\( 用 React\)

### 如何安装 @dexhunterio/swaps？

在项目目录运行 npm install @dexhunterio/swaps，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@radix-ui/react-accordion（^1\.1\.2 \|\| ^1\.2\.3）、@radix-ui/react-checkbox（^1\.0\.4 \|\| ^1\.1\.4）、@radix-ui/react-dialog（^1\.0\.4 \|\| ^1\.1\.6）、@radix-ui/react-dropdown-menu（^2\.0\.5 \|\| ^2\.1\.6）、@radix-ui/react-label（^2\.0\.2 \|\| ^2\.1\.2）、@radix-ui/react-popover（^1\.0\.6 \|\| ^1\.1\.6）、@radix-ui/react-progress（1\.0\.3）、@radix-ui/react-separator（^1\.0\.3 \|\| ^1\.1\.2）、@radix-ui/react-slider（^1\.1\.2 \|\| ^1\.2\.3）、@radix-ui/react-slot（^1\.0\.2 \|\| ^1\.1\.2）、@radix-ui/react-switch（^1\.0\.3 \|\| ^1\.1\.3）、@radix-ui/react-toast（^1\.1\.4 \|\| ^1\.2\.6）、@radix-ui/react-tooltip（^1\.0\.6 \|\| ^1\.1\.8）、@tabler/icons-react（^2\.30\.0 \|\| ^3\.31\.0）、@tanstack/react-query（^5\.59\.16 \|\| ^5\.67\.2）、axios（^1\.7\.7 \|\| ^1\.8\.2）、bech32（^2\.0\.0）、cbor-x（^1\.6\.0）、class-variance-authority（^0\.7\.0 \|\| ^0\.7\.1）、clsx（^2\.0\.0 \|\| ^2\.1\.1）、immer（^10\.0\.2 \|\| ^10\.1\.1）、lucide-react（^0\.263\.1 \|\| ^0\.479\.0）、moment（^2\.29\.4 \|\| ^2\.30\.1）、react（^18\.2\.0 \|\| ^19\.0\.0）、react-currency-input-field（^3\.6\.11 \|\| ^3\.10\.0）、react-dom（^18\.2\.0 \|\| ^19\.0\.0）、react-hotkeys-hook（^4\.4\.1 \|\| ^4\.6\.1）、react-spinners（^0\.13\.8 \|\| ^0\.15\.0）、react-virtuoso（^4\.4\.2 \|\| ^4\.12\.3）、tailwind-merge（^1\.14\.0）、tailwindcss-animate（^1\.0\.6 \|\| ^1\.0\.7）、use-debounce（^9\.0\.4 \|\| ^10\.0\.4）、zustand（^4\.4\.0 \|\| ^5\.0\.3）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @dexhunterio/swaps 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @dexhunterio/swaps 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @dexhunterio/swaps 可以商用吗？

@dexhunterio/swaps 使用 未声明 许可。package\.json 没有声明许可证。没有许可证的代码默认保留全部权利，商用前请联系作者或查看仓库中的 LICENSE 文件。以上为概括，不构成法律意见，请以许可原文为准。

### @dexhunterio/swaps 的下载量有多少？

根据 npm 官方下载统计，@dexhunterio/swaps 在 2026/10/12 – 2026/11/10 这 30 天内被下载 2,504 次，日均约 83 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @dexhunterio/swaps 还在维护吗？

最新版本 2\.0\.5 发布于 2026/05/13（6 个月前）；至今共发布 179 个版本，其中过去 12 个月发布了 8 个；首次发布于 2023/10/19。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。