diff --git a/README.md b/README.md index af72ea1baad1e600f4a28eab7c360a921c4938f3..3a19e049ae5e65a215966819b19a019506ffd662 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,7 @@ +# @zhengxs/js.tree +
-

-
-
- 👍 -
- @zhengxs/js.tree -
-
-

-
-
TypeScript @@ -44,17 +35,16 @@ License - -
-
+ -
快速，轻量，无依赖的树结构数据处理函数库。


+ 快速，轻量，无依赖的树结构数据处理函数库。 +

---- +## 特性 - 一个循环解决行转树的问题 - 转树除了添加 `children` 属性，不会修改任何数据 @@ -65,20 +55,19 @@ ## 快速开始 -[国内镜像](https://gitee.com/zhengxs2018/js.tree) - ### 文档 -- 转换 +- 说明文档 - [toTree 行转树](./docs/transform/toTree.md) - [toRows 树转行](./docs/transform/toRows.md) -- 操作 +- 操作函数 - [map 修改内容](./docs/operators/map.md) - [each 循环内容](./docs/operators/each.md) - [filter 过滤内容](./docs/operators/filter.md) - [exclude 排除内容](./docs/operators/exclude.md) - [repairWith 修复关系](./docs/operators/repairWith.md) -- [二次封装](./docs/advanced/custom.md) +- 高级用法 + - [二次封装](./docs/advanced/custom.md) ### 安装 @@ -96,18 +85,6 @@ toTree([ { id: 20000, parentId: null, title: '标题 2' }, { id: 11000, parentId: 10000, title: '标题 1-1' }, ]) -// -> -// [ -// { -// id: 10000, -// parentId: null, -// title: '标题 1', -// children: [ -// { id: 11000, parentId: 10000, title: '标题 1-1', children: [] } -// ] -// }, -// { id: 20000, parentId: null, title: '标题 2', children: [] }, -// ] ``` 支持任意关系字段的数据 @@ -122,30 +99,14 @@ const data = [ ] const result = toTree(data, { - // 如果 parentId 为 null 或 undefined 会合并一起 - // 使用 ROOT_ID 作为 key 保存 - // 支持函数，动态返回 root: ROOT_ID, - - // lodash 版本，支持 path, 如: nested.id - idKey: 'uid', // 可选，默认: id - - // lodash 版本，支持 path, 如: nested.parentId - parentKey: 'pid', // 可选，默认：parentId - - // 挂载子级的属性名称，默认：children + idKey: 'uid', + parentKey: 'pid', childrenKey: 'items', - - // 数据添加进 children 数组前的处理，可选 transform(data) { - // 通过浅拷贝避免修改原始数据 - // 可以在这里动态添加属性 return { ...data, checked: false } }, - - // 接管插入行为 insert(siblings, node) { - // ps: 任意层级的数据都是这样处理的 const index = siblings.findIndex((n) => n.sort > node.sort) if (index === -1) { @@ -155,46 +116,15 @@ const result = toTree(data, { } }, }) -// -> -// [ -// { -// uid: 10000, -// pid: null, -// title: '标题 1', -// sort: 1, -// checked: false, -// items: [ -// { -// uid: 11000, -// pid: 10000, -// title: '标题 1-1', -// sort: 3, -// checked: false, -// items: [] -// } -// ] -// }, -// { -// uid: 20000, -// pid: null, -// title: '标题 2', -// sort: 2, -// checked: false, -// items: [] -// } -// ] ``` -[Try in runkit](https://npm.runkit.com/@zhengxs/js.tree) - -## TypeScript +### TypeScript 支持 -内置 ts 类型 +内置类型定义，支持类型推导 ```ts import { toTree } from '@zhengxs/js.tree' -// 转换前的数据 type MenuItem = { id: string parentId: string @@ -202,24 +132,19 @@ type MenuItem = { url?: string } -// 转换后的数据 interface Nav extends MenuItem { items: Nav[] } -// 如果修改了 childrenKey -// 为了让类型提示正确，可以传入正确的类型 toTree