之前用过涉及到 object path 的一些 package ,但是发现这些 packages 的类型支持不是特别完善,比如 lodash, react-hook-form, formik, mongodb client 等。

这些 packages ,或多或少存在的几个问题是:

  • 没有类型约束,不能提供代码自动完成;
  • 生成的 path 不是标准的,大部分只支持 'a.b.c' 这种,这种 path 有一些缺点,与其他 package 不统一(例如 yup ),不能区分 object/array ,大部分都是判断如果是数字就当成数组处理,但是实际可能是 number key 的 object ;
  • 不能通过 path 反推出对应的类型。

因为我在写 react-happy-form 这个开源项目的时候,对 object path 这块需求比较高,所以就自己单独写了 object-standard-path 这个 package:

  • 提供了非常完善的类型支持(包括对一些特殊类型 any, Map 等的处理);
  • 生成的是标准的 path ;
  • 支持使用 path 对类型进行反推。

使用起来也非常简单,没有任何依赖,1k 不到的包体积,如果有需要的话,大家可以试试 :)

Repo 地址: https://github.com/react-earth/object-standard-path

可以的话,可以小点个 star ,每个 star 都是我以后持续更新的动力,感谢!🌟

import { Path, PathValue, pathGet, pathSet } from 'object-standard-path';

type Test = {
  value: string;
  array: {
    value: string;
  }[];
};

type TestPath = Path<Test>;
// result: "value" | "array" | `array[${number}]` | `array[${number}].value`

type TestPathValue = PathValue<Test, 'array[0]'>;
// result: { value: string }

const object = {
  array: [
    {
      value: 1,
    },
  ],
};

const result = pathGet(object, 'array[0].value');
// result: 1

pathSet(object, 'array[0].value', 2);
// result: { array: [{ value: 2 }] }

神的尾巴
2.2k 声望15 粉丝