🎉 enum-plus v3.0 已经发布了!
这是一个重大的里程碑版本升级,带来了很多令人兴奋的功能和改进,同时也包含了一些破坏性变更。请仔细阅读以下内容,以了解新版本的变化以及如何升级你的项目。请点击这里查看完整的API文档,如果你认为这个项目有帮助,请在 GitHub 上给它一个 ⭐️星标。
新功能
- 🔥 简化枚举初始化,不再需要
as const断言。
ts
// 之前
const WeekEnum = Enum({
Monday: { value: 1, label: '星期一' },
Tuesday: { value: 2, label: '星期二' },
} as const);
// 现在
const WeekEnum = Enum({
Monday: { value: 1, label: '星期一' },
Tuesday: { value: 2, label: '星期二' },
});
- 🔥 新增
enum.named属性,聚合所有枚举项,方便通过enum.named.XXX快速访问某个枚举项。
js
// 以前
const monday = WeekEnum.items.find(item => item.value === 1);
// 现在
const monday = WeekEnum.named.Monday;
- 🔥 新增
enum.meta对象,聚合枚举中定义的所有自定义字段,键为字段名,值为各字段的原始值。这样可以在不遍历枚举项的情况下访问自定义字段。
js
const ColorEnum = Enum({
Red: { value: 1, label: 'Red', hex: '#FF0000' },
Green: { value: 2, label: 'Green', hex: '#00FF00' },
Blue: { value: 3, label: 'Blue', hex: '#0000FF' },
});
ColorEnum.meta.hex; // ['#FF0000', '#00FF00', '#0000FF']
- 🔥 修改
enum.values的行为,现在它返回成员原始值的数组。请使用enum.items获取旧行为。
js
WeekEnum.values; // [1, 2, 3, 4, 5, 6, 7]
- 🔥 新增
enum.labels属性,返回成员标签的只读数组。
js
WeekEnum.labels; // ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期天']
- 🔥 新增
enum.toList方法,作为toSelect、toMenu、toFilter的替代品。后者已经被移出核心库,作为插件提供。
js
WeekEnum.toList();
// [
// { value: 1, label: '星期一' },
// { value: 2, label: '星期二' },
// ...
// ]
WeekEnum.toList({ valueField: 'id', labelField: 'name' });
// [
// { id: 1, name: '星期一' },
// { id: 2, name: '星期二' },
// ...
// ]
- 🔥 新增
enum.toMap方法,作为enum.toValueMap的替代品。
js
WeekEnum.toMap();
// {
// "1": '星期一',
// "2": '星期二',
// ...
// }
WeekEnum.toMap({ keySelector: 'key', valueSelector: 'value' });
// {
// "Monday": 1,
// "Tuesday": 2,
// ...
// }
- 新增
Enum.isEnum方法,用于检查一个对象是否是Enum的实例。
js
Enum.isEnum(WeekEnum); // true
- 🔥 新增
enum.findBy方法,允许通过内置字段和自定义 meta 字段(即自定义字段)搜索枚举项。
js
WeekEnum.findBy('value', 1); // { key: 'Monday', value: 1, label: '星期一' }
WeekEnum.findBy('key', 'Monday'); // { key: 'Monday', value: 1, label: '星期一' }
- 为
EnumCollection的instanceof检查添加类型断言。
ts
const value: typeof WeekEnum.valueType | string | { value: number; name: string };
if (value instanceof WeekEnum) {
console.log(value); // 现在 value 的类型是: 0 | 1 | 2 | 3 | 4 | 5 | 6
}
- 🔥 新增
Enum.install方法,用于安装插件。有关详细信息,请查看 插件系统。
ts
Enum.install(plugin);
-
🔥
Enum.extends方法对应的类型定义方式发生了变化,详情请参考 迁移指南 -
🔥 在
umd文件夹中发布UMD格式的模块。 -
支持多个 TypeScript 版本的平滑降级。对于 v5.0 及更高版本,允许在 Enum 初始化时省略
as const断言。对于较早版本,将自动降级为较早的语法,需要手动添加as const断言。
全局配置
- ✨ 引入
Enum.config来管理所有枚举的全局配置。Enum.config.autoLabel用于启用/禁用通过指定标签前缀来自动生成枚举项的标签。
- ✨ 添加
options.labelPrefix,用于在创建枚举时指定枚举项的标签前缀。 - ✨ 添加
options.autoLabel,用于在创建枚举时启用/禁用自动标签生成。它会覆盖全局配置。 - ✨ 允许扩展
EnumItemLabel类型以支持智能感知。
内部变更
-
移除
EnumItemClass内部的proxy,改用getter。这是为了防止循环引用,以支持在微信小程序中使用JSON.stringify。 -
为
Jest和e2e测试重用一份测试代码。 -
从代码库中移除
private member语法,因为它无法被完全序列化。 -
枚举项被修改的警告信息已被移除。
为了避免枚举项内的循环引用(这会影响序列化),我们移除了内部的
proxy,改用getter/setter。然而,这带来了另一个问题:在浏览器控制台或 node.js 中打印枚举项时,key、value和label无法显示它们的值,而是显示为[Getter/Setter]。这在某种程度上影响了调试体验。@yyz945947732 最早引入了这个功能,但经过权衡,我们不得不移除掉这个特性。对此我感到抱歉。
插件系统
- 🔥 引入新的插件系统,以独立的 npm 包形式扩展功能。以下是可用的包:
- @enum-plus/plugin-antd: Ant Design 相关功能,包括
enum.toSelect、enum.toMenu、enum.toFilter和enum.toValueMap。通过这些方法,可以直接将枚举绑定到对应的 Ant Design 组件上,极大地简化了代码。 - @enum-plus/plugin-i18next: i18next 本地化支持。
- @enum-plus/plugin-react-i18next:自动适配 react-i18next 以让枚举支持国际化。
- @enum-plus/plugin-react: React 集成,包括支持
Enum.localize返回 React 组件,以及监听语言变化以自动重新渲染组件。 - @enum-plus/plugin-i18next-vue:集成 i18next-vue 并实现枚举标签的国际化,支持切换语言后自动更新UI。
- @enum-plus/plugin-vue-i18n:集成 vue-i18n 并实现枚举标签的国际化,支持切换语言后自动更新UI。
- @enum-plus/plugin-antd: Ant Design 相关功能,包括
如果您搜索的插件不可用,或者您想开发自己的插件,请参阅 插件开发指南。 我们真诚地需要您的帮助,来丰富插件生态系统!
破坏性变更
- 修改
enum.values的行为,现在它返回成员原始值的数组。请使用enum.items获取旧行为。 - 以下符号已被重命名,以更好地反映其用途:
ENUM_COLLECTION变更为IS_ENUMENUM_ITEM变更为IS_ENUM_ITEMENUM_ITEMS变更为IS_ENUM_ITEMS
enum.toSelect被迁移到插件库,请安装 @enum-plus/plugin-antd。enum.toMenu被迁移到插件库,请安装 @enum-plus/plugin-antd。enum.toFilter被迁移到插件库,请安装 @enum-plus/plugin-antd。enum.toValueMap被迁移到插件库,请安装 @enum-plus/plugin-antd。- 移除已弃用的
enum.options - 移除已弃用的
enum.menus - 移除已弃用的
enum.filters - 移除已弃用的
enum.valuesEnum
Bug 修复
- 修复
lib目录下的 sourcemap 文件无法被解析的问题。