diff --git a/packages/devui-vue/devui/tree/__tests__/tree.spec.ts b/packages/devui-vue/devui/tree/__tests__/tree.spec.ts index 427125f6d7..08590ffe06 100644 --- a/packages/devui-vue/devui/tree/__tests__/tree.spec.ts +++ b/packages/devui-vue/devui/tree/__tests__/tree.spec.ts @@ -169,19 +169,19 @@ describe('tree', () => { }) it('should expand and collapse correctly', async () => { - const firstNode: Element = wrapper.element.firstElementChild + const firstNode = wrapper.get('.devui-tree-node:first-child') // 初始状态,节点是展开的 - expect(firstNode.classList).toContain('devui-tree-node__open') - + expect(firstNode.classes()).toContain('devui-tree-node__open') + // 点击之后,节点收起 - await wrapper.find('.devui-tree-node').trigger('click') + await wrapper.get('.devui-tree-node__folder:first-child').trigger('click') await nextTick() - expect(firstNode.classList).not.toContain('devui-tree-node__open') + expect(firstNode.classes()).not.toContain('devui-tree-node__open') // 再次点击,节点展开 - await wrapper.find('.devui-tree-node').trigger('click') + await wrapper.get('.devui-tree-node__folder:first-child').trigger('click') await nextTick() - expect(firstNode.classList).toContain('devui-tree-node__open') + expect(firstNode.classes()).toContain('devui-tree-node__open') }) }) diff --git a/packages/devui-vue/devui/tree/src/tree.tsx b/packages/devui-vue/devui/tree/src/tree.tsx index 7239b04a64..c75410d5aa 100644 --- a/packages/devui-vue/devui/tree/src/tree.tsx +++ b/packages/devui-vue/devui/tree/src/tree.tsx @@ -102,11 +102,16 @@ export default defineComponent({ return toggle(target, item) } return ( - isParent || children && children.length - ? open - ? - : - : +
+ { + isParent || children && children.length + ? open + ? + : + : + } +
+ ) } const checkState = CHECK_CONFIG[selected.value[id] ?? 'none'] @@ -134,24 +139,9 @@ export default defineComponent({ ) } - const renderTree = (tree) => { - return tree.map(item => { - if (!item.children) { - return renderNode(item) - } else { - return ( - <> - {renderNode(item)} - {renderTree(item.children)} - - ) - } - }) - } return () => { return (
- {/* { renderTree(data.value) } */} { openedData.value.map(item => renderNode(item)) }
)