fix(components): [tree-v2] expand all ancestor nodes of the specified node (#18077)

* fix(components): [tree-v2] Allow only all nodes to be expandable

closed #18073

* fix(components): [tree-v2] Allow all nodes to be expandable

closed #18073

* fix(components): [tree-v2] Allow all nodes to be expandable

closed #18073

* fix(components): [tree-v2] Allow all nodes to be expandable

closed #18073

* fix(components): [tree-v2] Allow all nodes to be expandable

closed #18073

---------

Co-authored-by: Tusker Manshu <dadaguai-git>
This commit is contained in:
Manshu Tusker 2024-09-03 07:16:27 +08:00 committed by GitHub
parent 3a37320944
commit fcf2249cc9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 94 additions and 23 deletions

View File

@ -593,6 +593,73 @@ describe('Virtual Tree', () => {
expect(nodes.length).toBe(5)
})
test('setExpandedKeys', async () => {
const { treeRef, wrapper } = createTree({
data() {
return {
height: 400,
data: [
{
id: '1',
label: 'node-1',
children: [
{
id: '1-1',
label: 'node-1-1',
children: [
{
id: '1-1-1',
label: 'node-1-1-1',
children: [
{
id: '1-1-1-1',
label: 'node-1-1-1-1',
},
{
id: '1-1-1-2',
label: 'node-1-1-1-2',
},
],
},
{
id: '1-1-2',
label: 'node-1-1-2',
},
],
},
],
},
{
id: '2',
label: 'node-2',
children: [
{
id: '2-1',
label: 'node-2-1',
children: [
{
id: '2-1-1',
label: 'node-2-1-1',
},
{
id: '2-1-2',
label: 'node-2-1-2',
},
],
},
],
},
],
}
},
})
await nextTick()
treeRef.setExpandedKeys(['1-1'])
await nextTick()
const nodes = wrapper.findAll(TREE_NODE_CLASS_NAME)
expect(nodes.length).toBe(5)
})
test('indent', async () => {
const { wrapper } = createTree({
data() {

View File

@ -88,31 +88,24 @@ export function useTree(
const expandedKeys = expandedKeySet.value
const hiddenKeys = hiddenNodeKeySet.value
const flattenNodes: TreeNode[] = []
const nodes = (tree.value && tree.value.treeNodes) || []
function traverse() {
const nodes = tree.value?.treeNodes || []
const stack: TreeNode[] = []
for (let i = nodes.length - 1; i >= 0; --i) {
stack.push(nodes[i])
}
while (stack.length) {
const node = stack.pop()
if (!node) continue
if (!hiddenKeys.has(node.key)) {
const node = stack.pop()!
if (hiddenKeys.has(node.key)) continue
flattenNodes.push(node)
}
// Only "visible" nodes will be rendered
if (expandedKeys.has(node.key)) {
const children = node.children
if (children) {
const length = children.length
for (let i = length - 1; i >= 0; --i) {
stack.push(children[i])
if (node.children && expandedKeys.has(node.key)) {
for (let i = node.children.length - 1; i >= 0; --i) {
stack.push(node.children[i])
}
}
}
}
}
traverse()
return flattenNodes
})
@ -202,7 +195,18 @@ export function useTree(
}
function setExpandedKeys(keys: TreeKey[]) {
expandedKeySet.value = new Set(keys)
const expandedKeys = new Set<TreeKey>()
const nodeMap = tree.value!.treeNodeMap
keys.forEach((k) => {
let node = nodeMap.get(k)
while (node && !expandedKeys.has(node.key)) {
expandedKeys.add(node.key)
node = node.parent
}
})
expandedKeySet.value = expandedKeys
}
function handleNodeClick(node: TreeNode, e: MouseEvent) {