Skip to content

Commit cad2e15

Browse files
axoloaxolo
committed
docs: update treeFilter
1 parent 4989d65 commit cad2e15

File tree

5 files changed

+256
-20
lines changed

5 files changed

+256
-20
lines changed

‎docs/arrayNode.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# 列表节点
1+
# 列表溯源节点
22

33
```js
44
arrayNode(array, id, [options])

‎docs/treeDeep.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ treeDeep(tree, [options], [deep = 1])
1010

1111
| 参数 | 类型 | 默认 | 说明 |
1212
| --------- | -------- | ---- | -------------------------------- |
13-
| `tree` | `tree` | | [树状结构数据](./param.md#tree) |
13+
| `tree` | `array` | | [树状结构数据](./param.md#tree) |
1414
| `options` | `object` | | [配置选项](./param.md#options) |
1515
| `deep` | `number` | `1` | 初始深度，以此基础累加到最大深度 |
1616

‎docs/treeFilter.md

Lines changed: 154 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,161 @@
1-
# treeFilter
2-
3-
get new tree filter by condition function like `node => !node.hide`
4-
5-
## 调用
1+
# 树过滤
62

73
```js
84
treeFilter(tree, condition, [options])
95
```
106

7+
从树中按条件过滤得到一棵新的树。其中，过滤条件为一个函数，如：`node => !node.hide`。
8+
9+
::: tip 深拷贝
10+
推荐使用 [lodash.clonedeep] 深拷贝，以避免原始数据遭到不必要的篡改。
11+
:::
12+
13+
## 参数
14+
15+
| 参数 | 类型 | 默认 | 说明 |
16+
| ----------- | ---------- | ---- | -------------------------------------- |
17+
| `tree` | `array` | | [树状结构数据](./param.md#tree) |
18+
| `condition` | `function` | | 过滤条件函数，如：`node => !node.hide` |
19+
| `options` | `object` | | [配置选项](./param.md#options) |
20+
1121
## 返回
1222

13-
tree
23+
| 参数 | 类型 | 说明 |
24+
| ---- | ------- | ---------------- |
25+
| * | `array` | 过滤后得到的新树 |
26+
27+
## 示例
28+
29+
::: code-group
30+
```js [调用]
31+
import cloneDeep from 'lodash.clonedeep'
32+
import { treeFilter } from '@axolo/tree-array'
33+
34+
const tree = [{
35+
id: 'home',
36+
path: '/home',
37+
parentId: null
38+
}, {
39+
id: 'chart',
40+
path: '/chart',
41+
parentId: null,
42+
children: [{
43+
id: 'chartIndex',
44+
path: '/chart/index',
45+
parentId: 'chart',
46+
children: [{
47+
id: 'chartIndexTop',
48+
path: '/chart/index/top',
49+
parentId: 'chartIndex'
50+
}, {
51+
id: 'chartIndexActive',
52+
path: '/chart/index/active',
53+
parentId: 'chartIndex',
54+
children: [{
55+
id: 'chartIndexActiveMy',
56+
path: '/chart/index/active/my',
57+
parentId: 'chartIndexActive'
58+
}]
59+
}]
60+
}, {
61+
id: 'chartReview',
62+
path: '/chart/review',
63+
parentId: 'chart'
64+
}, {
65+
id: 'chartProject',
66+
path: '/chart/project',
67+
parentId: 'chart',
68+
children: [{
69+
id: 'chartProjectYou',
70+
path: '/chart/project/you',
71+
parentId: 'chartProject',
72+
test: true
73+
}, {
74+
id: 'chartProjectMy',
75+
path: '/chart/project/my',
76+
parentId: 'chartProject',
77+
children: [{
78+
id: 'chartProjectMyOne',
79+
path: '/chart/project/my/one',
80+
parentId: 'chartProjectMy'
81+
}, {
82+
id: 'chartProjectMyTwo',
83+
path: '/chart/project/my/two',
84+
parentId: 'chartProjectMy'
85+
}]
86+
}]
87+
}]
88+
}, {
89+
id: 'smile',
90+
path: '/smile',
91+
parentId: null,
92+
children: [{
93+
id: 'smileIndex',
94+
path: '/smile/index',
95+
parentId: 'smile',
96+
test: true
97+
}]
98+
}]
99+
100+
treeFilter(cloneDeep(tree), i => !i.test) // new tree
101+
```
102+
103+
```json [结果]
104+
[{
105+
"id": "home",
106+
"path": "/home",
107+
"parentId": null
108+
}, {
109+
"id": "chart",
110+
"path": "/chart",
111+
"parentId": null,
112+
"children": [{
113+
"id": "chartIndex",
114+
"path": "/chart/index",
115+
"parentId": "chart",
116+
"children": [{
117+
"id": "chartIndexTop",
118+
"path": "/chart/index/top",
119+
"parentId": "chartIndex"
120+
}, {
121+
"id": "chartIndexActive",
122+
"path": "/chart/index/active",
123+
"parentId": "chartIndex",
124+
"children": [{
125+
"id": "chartIndexActiveMy",
126+
"path": "/chart/index/active/my",
127+
"parentId": "chartIndexActive"
128+
}]
129+
}]
130+
}, {
131+
"id": "chartReview",
132+
"path": "/chart/review",
133+
"parentId": "chart"
134+
}, {
135+
"id": "chartProject",
136+
"path": "/chart/project",
137+
"parentId": "chart",
138+
"children": [{
139+
"id": "chartProjectMy",
140+
"path": "/chart/project/my",
141+
"parentId": "chartProject",
142+
"children": [{
143+
"id": "chartProjectMyOne",
144+
"path": "/chart/project/my/one",
145+
"parentId": "chartProjectMy"
146+
}, {
147+
"id": "chartProjectMyTwo",
148+
"path": "/chart/project/my/two",
149+
"parentId": "chartProjectMy"
150+
}]
151+
}]
152+
}]
153+
}, {
154+
"id": "smile",
155+
"path": "/smile",
156+
"parentId": null
157+
}]
158+
```
159+
:::
160+
161+
[lodash.clonedeep]: https://www.npmjs.com/package/lodash.clonedeep

‎docs/treeNode.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# 树节点
1+
# 树溯源节点
22

33
```js
44
treeNode(tree, id, [options])
@@ -10,7 +10,7 @@ treeNode(tree, id, [options])
1010

1111
| 参数 | 类型 | 默认 | 说明 |
1212
| --------- | -------- | ---- | -------------------------------------------------- |
13-
| `tree` | `tree` | | [树状结构数据](./param.md#tree) |
13+
| `tree` | `array` | | [树状结构数据](./param.md#tree) |
1414
| `id` | `any` | | [主键](./param.md#id)的值，如：`chartProjectMyTwo` |
1515
| `options` | `object` | | [配置选项](./param.md#options) |
1616

@@ -97,10 +97,10 @@ treeNode(tree, 'chartProjectMyTwo') // array of id
9797

9898
```json [结果]
9999
[
100-
"chart",
101-
"chartProject",
102-
"chartProjectMy",
103-
"chartProjectMyTwo"
100+
"chart",
101+
"chartProject",
102+
"chartProjectMy",
103+
"chartProjectMyTwo"
104104
]
105105
```
106106
:::

‎docs/treePath.md

Lines changed: 94 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,101 @@
1-
# treePath
2-
3-
get path of index from tree by id, like `[0, 2, 1]`
4-
5-
## 调用
1+
# 树溯源索引
62

73
```js
84
treePath(tree, id, [options])
95
```
106

7+
根据主键的值从树中溯源，返回**从根到自身**顺序的索引数组，如：`[1, 2, 1, 1]`。
8+
9+
## 参数
10+
11+
| 参数 | 类型 | 默认 | 说明 |
12+
| --------- | -------- | ---- | -------------------------------------------------- |
13+
| `tree` | `tree` | | [树状结构数据](./param.md#tree) |
14+
| `id` | `any` | | [主键](./param.md#id)的值，如：`chartProjectMyTwo` |
15+
| `options` | `object` | | [配置选项](./param.md#options) |
16+
1117
## 返回
1218

13-
array
19+
| 参数 | 类型 | 说明 |
20+
| ---- | ------- | ---------------------------- |
21+
| * | `array` | 从根到自身顺序溯源的索引数组 |
22+
23+
## 示例
24+
25+
::: code-group
26+
```js [调用]
27+
import { treePath } from '@axolo/tree-array'
28+
29+
const tree = [{
30+
id: 'home',
31+
path: '/home',
32+
parentId: null
33+
}, {
34+
id: 'chart',
35+
path: '/chart',
36+
parentId: null,
37+
children: [{
38+
id: 'chartIndex',
39+
path: '/chart/index',
40+
parentId: 'chart',
41+
children: [{
42+
id: 'chartIndexTop',
43+
path: '/chart/index/top',
44+
parentId: 'chartIndex'
45+
}, {
46+
id: 'chartIndexActive',
47+
path: '/chart/index/active',
48+
parentId: 'chartIndex',
49+
children: [{
50+
id: 'chartIndexActiveMy',
51+
path: '/chart/index/active/my',
52+
parentId: 'chartIndexActive'
53+
}]
54+
}]
55+
}, {
56+
id: 'chartReview',
57+
path: '/chart/review',
58+
parentId: 'chart'
59+
}, {
60+
id: 'chartProject',
61+
path: '/chart/project',
62+
parentId: 'chart',
63+
children: [{
64+
id: 'chartProjectYou',
65+
path: '/chart/project/you',
66+
parentId: 'chartProject',
67+
test: true
68+
}, {
69+
id: 'chartProjectMy',
70+
path: '/chart/project/my',
71+
parentId: 'chartProject',
72+
children: [{
73+
id: 'chartProjectMyOne',
74+
path: '/chart/project/my/one',
75+
parentId: 'chartProjectMy'
76+
}, {
77+
id: 'chartProjectMyTwo',
78+
path: '/chart/project/my/two',
79+
parentId: 'chartProjectMy'
80+
}]
81+
}]
82+
}]
83+
}, {
84+
id: 'smile',
85+
path: '/smile',
86+
parentId: null,
87+
children: [{
88+
id: 'smileIndex',
89+
path: '/smile/index',
90+
parentId: 'smile',
91+
test: true
92+
}]
93+
}]
94+
95+
treePath(tree, 'chartProjectMyTwo') // array of index
96+
```
97+
98+
```json [结果]
99+
[1, 2, 1, 1]
100+
```
101+
:::

0 commit comments

Comments
 (0)