ant-design-vue icon indicating copy to clipboard operation
ant-design-vue copied to clipboard

a-tree 同一叶子节点下,缩进各不一样,导致页面凌乱不堪

Open 123LCQ opened this issue 1 year ago • 6 comments
trafficstars

  • [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.2.20

Environment

"vue": "^3.2.25",

Reproduction link

https://2x.antdv.com/components/tree-cn/#Tree-

Steps to reproduce

<a-tree 同一叶子节点下,缩进各不一样,导致页面凌乱不堪。发下是设置:field-names="fieldNames" 导致的, const fieldNames = { children: 'children', title: 'orgName', key: 'orgId' }

<a-tree v-if="treeData.length && visible" id="tree" v-model:expandedKeys="expandedKeys" v-model:checkedKeys="checkedKeys" v-model:selectedKeys="selectedKeys" :checkable="isMultiple" :tree-data="treeData" :field-names="fieldNames" :checkStrictly="true" @check="handleCheck" @select="handleSelect"

<template #title="record">

{{ record.orgName }} {{ record.orgName }}

What is expected?

现象: https://photo.harsonserver.com/1727337272463.png https://photo.harsonserver.com/1727337313198.png

数据结构:https://photo.harsonserver.com/1727337537529.png 递归json 数据字段就是 关键三个: orgId/orgName/children

What is actually happening?

实际上就是同一级下的叶子节点缩进各不一样,导致排版错乱,看起来都不方便

123LCQ avatar Sep 26 '24 08:09 123LCQ