formatStrategyIdsInTree【树形数据中只选中父节点】 🔥
描述
从集合中,去除父子同时存在的 keys,只选中父节点, 3.0.25-beta-4+
# 1.示例
输出结果,点开查看 👇
formatStrategyIdsInTree({ tree, keys: [2, 2004, 2004004, 2004005, 1, 1001], props: { children: 'children', id: 'id' } })
1
# 2.入参说明
# 主入参
| 参数 | 说明 | 类型 | 是否必填 | 默认值 |
|---|---|---|---|---|
| tree | 原数据,树状结构 | Array | 是 | |
| keys | 原有的 keys 集合 | Object | 否 | |
| props | 属性映射详情见下 👇 | Object | 否 | |
| cache | 缓存详情见下 👇 | Object | 否 | |
| currentKey | 当前选择的 key,记住当前选中的 key | String Number | 否 |
# props 对象
| 参数 | 说明 | 类型 | 是否必填 | 默认值 |
|---|---|---|---|---|
| id | 自身主键名,唯一标识 | String | 否 | id |
| children | 树状 children 键名 | String | 否 | children |
# cache 对象
| 参数 | 说明 | 类型 | 是否必填 | 默认值 |
|---|---|---|---|---|
| treeObjById | tree 转换成对象结构,其中键名值是由props.id决定的 | Object | 否 | |
| treeObjByid | tree 转换成对象结构,其中键名值是由递归__id__决定的 | Object | 否 |
# 3.源码
源码,点开查看 👈
import eachTree from '@/array/eachTree'
import orderBy from '@/array/orderBy'
import isArray from '@/base/isArray'
import arrayToMap from '@/array/arrayToMap'
import isNoNullable from '@/base/isNoNullable'
import uniq from '@/array/uniq'
import { _getPathLists, _includesChildPath } from '@/_helper/_helperTreeBase'
import merge from '@/object/merge'
/**
* 从集合中,去除父子同时存在的keys,只选中父节点
* 比如地区选择器,如果先选择江苏,然后选择无锡,那么这里的key,只会存在无锡
* 如果江苏下,所有的城市都已经选择了,那么只会存在江苏
* @param tree 树形数据
* @param keys 原有的keys集合
* @param [currentKey] 当前选择的key,记住是当前选中的key
* @param [props] 属性映射
* @param [cache] 缓存
* @param {string[]} [props.children]
* @param {string} [props.id]
* @param {undefined|Function} [props.treeObjById]
* @param {undefined|Function} [props.treeObjBy__id__]
* @example
* formatStrategyIdsInTree({ tree, keys: [2, 2004, 2004004, 2004005, 1, 1001], props: {children: 'children', id: 'id'} })
*/
function formatStrategyIdsInTree({
tree = [],
keys = [],
currentKey = [],
props = {},
cache = { treeObjById: undefined, treeObjBy__id__: undefined }
}) {
let defaultProps = { children: 'children', id: 'id' }, // 默认props
treeObjBy__id__ = cache.treeObjBy__id__, // 树形对象通过id
treeObjById = cache.treeObjById
props = merge({}, defaultProps, props) // 树形应
if (!treeObjBy__id__ || !treeObjById) {
treeObjBy__id__ ||= {}
treeObjById ||= {}
eachTree({
tree: tree,
props: {
children: props.children
},
callbackItem: item => {
treeObjById[item[props.id]] = item
treeObjBy__id__[item.__id__] = item
}
})
}
const delNodesMap = new Map(), // 删除Node集合
addNodesMap = new Map() // 新增Node集合
currentKey = isArray(currentKey) ? currentKey.at(-1) : currentKey
const currentNode = treeObjById[currentKey]
if (currentNode) {
addNodesMap.set(currentNode[props.id], true) // 新增子节点
Object.values(treeObjById).forEach(v => {
if (v.__id__ != currentNode.__id__ && _includesChildPath(v.__id__, currentNode.__id__)) {
delNodesMap.set(v[props.id], true) // 移除节点
}
})
}
const plainKeys = keys.map(v => (isArray(v) ? v.at(-1) : v)).filter(v => !delNodesMap.has(v)), // 平面keys集合
keysMap = arrayToMap(plainKeys), // keys映射,对象map
keysMapNodes = orderBy(plainKeys.map(v => treeObjById[v]).filter(isNoNullable), ['__level__'], ['desc']) // keys映射节点,对象map
delNodesMap.clear()
// console.log('keysMapNodes', keysMapNodes)
// 递归node
const itorNode = node => {
if (!node) return
// console.log('node',node, node[props.children], keysMap, props.id)
if (isArray(node[props.children]) && node[props.children]?.length) {
const isAll = node[props.children].every(o => keysMap.has(o[props.id])) // 全部已存在,选择父亲
if (isAll) {
// 父节点选中
addNodesMap.set(node[props.id], true) // 新增子节点
node[props.children].forEach(o => {
delNodesMap.set(o[props.id], true) // 移除父节点
})
} else {
// 父节点下某一个子节点
if (node[props.children].some(o => keysMap.has(o[props.id]))) {
delNodesMap.set(node[props.id], true) // 移除父节点
}
}
}
itorNode(node?.__parentNode__)
}
keysMapNodes.forEach(v => {
itorNode(v)
})
const addKeys = []
addNodesMap.forEach((_, k) => {
// 从新增的node集合中,去除删除的node
if (delNodesMap.has(k)) {
addNodesMap.delete(k)
} else {
addKeys.push(k)
}
})
const ids = uniq(plainKeys.filter(v => !delNodesMap.has(v)).concat(addKeys))
// console.log('formatStrategyIdsInTree', { addNodesMap, delNodesMap, ids, keys })
if (isArray(keys[0])) {
return ids.map(v => {
const node = treeObjById[v]
return node
? _getPathLists(node.__id__)
.map(v => treeObjBy__id__[v]?.[props.id])
.filter(Boolean)
: []
})
}
return ids
}
// 2, 2004, 2004004, 2004005,
// console.log(formatStrategyIdsInTree({ keys: [2, 2004, 2004004, 2004005, 1, 1001], tree }))
export default formatStrategyIdsInTree
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
上次更新: 2024/02/20, 17:23:36