# @enum-plus/plugin-next-international 中文文档

规范地址：https://npmcn.com/package/%40enum-plus/plugin-next-international/

版本：1\.0\.0
npm 元数据更新时间：2025-12-23T11:26:18.247Z
中文译文更新时间：2026-11-13T18:48:15.511Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40enum-plus/plugin-next-international
原文对照：https://npmcn.com/package/%40enum-plus/plugin-next-international/?lang=original
项目主页：https://github.com/shijistar/enum-plus/tree/master/packages/plugin-i18next
源码仓库：https://github.com/shijistar/enum-plus

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

- 包体积（解压后）：182 kB，94 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：0 个
- peer 依赖：enum-plus ^3\.0\.0，next-international \>=1\.1\.0，react \>=16\.0\.0
- 首次发布：2025-12-23T11:26:17.611Z
- 最新版本发布：2025-12-23T11:26:17.910Z
- 近 30 天下载量：7226（2026-10-14 至 2026-11-12，npm 官方下载统计）
- 已发布版本数：1（近 12 个月 1 个）

## 中文简介

一个支持enums国际化的enum-plus插件,通过下个国际

## 安装

```sh
npm install @enum-plus/plugin-next-international
```

也可以使用：`pnpm add @enum-plus/plugin-next-international`、`yarn add @enum-plus/plugin-next-international`、`bun add @enum-plus/plugin-next-international`

## README

[English](https://npmcn.com/package/%40enum-plus/plugin-next-international/README.md) | [中文](https://npmcn.com/package/%40enum-plus/plugin-next-international/README.zh-CN.md) | [CHANGELOG](https://npmcn.com/package/%40enum-plus/plugin-next-international/CHANGELOG.md)

# @enum-plus/plugin-next-international

[![npm version](https://img.shields.io/npm/v/@enum-plus/plugin-next-international.svg)](https://www.npmjs.com/package/@enum-plus/plugin-next-international) [![license](https://img.shields.io/npm/l/@enum-plus/plugin-next-international.svg)](https://www.npmjs.com/package/@enum-plus/plugin-next-international)

> 集成 [next-international](https://next-international.vercel.app/) 并实现枚举标签的国际化

## 简介

`@enum-plus/plugin-next-international` 是 [enum-plus](https://github.com/shijistar/enum-plus) 的一个插件，自动集成 [next-international](https://next-international.vercel.app/) 实现枚举标签的国际化。它允许你在枚举定义中使用 next-international 的本地化键，并动态显示为当前语言的翻译文本。

> ⚠️ 请注意，该插件仅支持在客户端环境，不支持在服务端渲染。

## 安装

```bash
npm install @enum-plus/plugin-next-international
```

在应用程序的入口文件中，导入 `@enum-plus/plugin-next-international` 插件并安装：

```js
import { clientI18nPlugin } from '@enum-plus/plugin-next-international';
import { Enum } from 'enum-plus';

Enum.install(clientI18nPlugin);
```

## 插件选项

安装插件时，可以传入一个配置对象，用于设置插件的全局选项：

```ts
Enum.install(clientI18nPlugin, {
  localize: {
    /**
     * 本地化输出结果，默认为 'text'
     *
     * - `text`: 返回纯文本字符串，不会随语言变化而变化
     * - `component`: 返回 React 组件实例，切换语言后会自动更新显示内容
     */
    mode: 'text',
  },
  isMatch: {
    defaultSearchField: 'label', // isMatch 方法的默认搜索字段，默认为 'label'
  },
});
```

## 用法

### 枚举标签响应语言的变化

可以通过在枚举定义中使用本地化键，来实现枚举标签的国际化。

-   **使用文本模式（默认）**

```js
import { clientI18nPlugin } from '@enum-plus/plugin-next-international';
import { Enum } from 'enum-plus';
import { useChangeLocale } from './path/to/client';

// index.js
Enum.install(clientI18nPlugin, {
  localize: {
    mode: 'text',
  },
});

// SomeComponent.js
const changeLanguage = useChangeLocale();
const WeekEnum = Enum(
  {
    Monday: { value: 1, label: 'week.monday' },
    Tuesday: { value: 2, label: 'week.tuesday' },
  },
  {
    name: 'weekDays.name', // 枚举类型名称，可选
  }
);

WeekEnum.label(1); // Monday
WeekEnum.name; // Week

changeLanguage('zh-CN');
WeekEnum.label(1); // 星期一
WeekEnum.name; // 周
```

-   **使用组件模式**

```js
import { clientI18nPlugin } from '@enum-plus/plugin-next-international';
import { Enum } from 'enum-plus';
import { useChangeLocale } from './path/to/client';

// index.js
Enum.install(clientI18nPlugin, {
  localize: {
    mode: 'component',
  },
});

// SomeComponent.js
const changeLanguage = useChangeLocale();
const WeekEnum = Enum(
  {
    Monday: { value: 1, label: 'week.monday' },
    Tuesday: { value: 2, label: 'week.tuesday' },
  },
  {
    name: 'weekDays.name', // 枚举类型名称，可选
  }
);

WeekEnum.label(1); // React组件，显示为 Monday，可自动响应语言变化
WeekEnum.name; // React组件，显示为 Week，可自动响应语言变化

changeLanguage('zh-CN');
WeekEnum.label(1); // React组件，显示为 星期一，可自动响应语言变化
WeekEnum.name; // React组件，显示为 周，可自动响应语言变化
```

从枚举生成的UI组件，当语言变化时，标签会自动更新：

```tsx
import { Button, Select } from 'antd';
import { useChangeLocale } from './path/to/client';

const changeLanguage = useChangeLocale();

<Select options={WeekEnum.items} defaultValue={WeekEnum.Monday} />;
// 选中并显示: Monday

<Button onClick={() => changeLanguage('zh-CN')}>切换语言</Button>;

// 切换语言后，选中项的文本会自动更新为: 星期一
```

### 下拉框搜索

在 `组件` 模式下，由于枚举的 `label` 已经变成了组件实例，而不是字符串类型，故无法直接用于文本搜索。可以使用 `isMatch` 或 `isMatchCaseSensitive` 方法来实现对枚举项的过滤。

```tsx
import { Select } from 'antd';

<Select options={WeekEnum.items} filterOption={WeekEnum.isMatch} />;
```

## 其它API

### 💎 isMatch

**_\[方法\]_**   `isMatch(searchText: string, item: EnumItem): boolean`

`isMatch` 方法用于根据搜索文本过滤枚举项，支持对枚举项的 `label` 进行模糊匹配，且忽略大小写。

-   下拉框搜索

```tsx
import { Select } from 'antd';

<Select options={WeekEnum.items} filterOption={WeekEnum.isMatch} />;
```

-   常规过滤的用法

```js
WeekEnum.items.filter((item) => WeekEnum.isMatch('Mon', item)); // 过滤出 label 中包含 'Mon' 的枚举项
```

### 💎 isMatchCaseSensitive

**_\[方法\]_**   `isMatchCaseSensitive(searchText: string, item: EnumItem): boolean`

`isMatchCaseSensitive` 方法用于根据搜索文本过滤枚举项，支持对枚举项的 `label` 进行模糊匹配，且区分大小写。

-   下拉框搜索

```tsx
import { Select } from 'antd';

<Select options={WeekEnum.items} filterOption={WeekEnum.isMatchCaseSensitive} />;
```

-   常规过滤用法

```js
WeekEnum.items.filter((item) => WeekEnum.isMatch('mon', item)); // 过滤出 label 中包含 'mon' 的枚举项 (区分大小写)
```

## 常见问题

### @enum-plus/plugin-next-international 是什么？

一个支持enums国际化的enum-plus插件,通过下个国际

### 如何安装 @enum-plus/plugin-next-international？

在项目目录运行 npm install @enum-plus/plugin-next-international，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：enum-plus（^3\.0\.0）、next-international（\>=1\.1\.0）、react（\>=16\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @enum-plus/plugin-next-international 支持 TypeScript 吗？

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

### @enum-plus/plugin-next-international 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @enum-plus/plugin-next-international 可以商用吗？

@enum-plus/plugin-next-international 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @enum-plus/plugin-next-international 的下载量有多少？

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

### @enum-plus/plugin-next-international 还在维护吗？

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

