Skip to content

Commit ac70da1

Browse files
tangjinzhoutangjinzhou
committed
fix: tree fieldNames error #4726 
1 parent 62c6f0e commit ac70da1

File tree

7 files changed

+28
-30
lines changed

7 files changed

+28
-30
lines changed

‎components/tree/utils/dictUtil.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,17 @@ export function calcRangeKeys({
2828
expandedKeys,
2929
startKey,
3030
endKey,
31-
fieldNames,
31+
fieldNames = {
32+
title: 'title',
33+
key: 'key',
34+
children: 'children',
35+
},
3236
}: {
3337
treeData: DataNode[];
3438
expandedKeys: Key[];
3539
startKey?: Key;
3640
endKey?: Key;
37-
fieldNames: FieldNames;
41+
fieldNames?: FieldNames;
3842
}): Key[] {
3943
const keys: Key[] = [];
4044
let record: Record = Record.None;

‎components/vc-tree/NodeList.tsx

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -71,20 +71,17 @@ export function getMinimumRangeTransitionRange(
7171
}
7272

7373
function itemKey(item: FlattenNode) {
74-
const {
75-
data: { key },
76-
pos,
77-
} = item;
74+
const { key, pos } = item;
7875
return getKey(key, pos);
7976
}
8077

8178
function getAccessibilityPath(item: FlattenNode): string {
82-
let path = String(item.data.key);
79+
let path = String(item.key);
8380
let current = item;
8481

8582
while (current.parent) {
8683
current = current.parent;
87-
path = `${current.data.key} > ${path}`;
84+
path = `${current.key} > ${path}`;
8885
}
8986

9087
return path;
@@ -104,7 +101,6 @@ export default defineComponent({
104101
},
105102
getIndentWidth: () => indentMeasurerRef.value.offsetWidth,
106103
});
107-
108104
// ============================== Motion ==============================
109105
const transitionData = ref<FlattenNode[]>(props.data);
110106
const transitionRange = ref([]);
@@ -121,12 +117,10 @@ export default defineComponent({
121117
[() => [...props.expandedKeys], () => props.data],
122118
([expandedKeys, data], [prevExpandedKeys, prevData]) => {
123119
const diffExpanded = findExpandedKeys(prevExpandedKeys, expandedKeys);
124-
125120
if (diffExpanded.key !== null) {
126121
const { virtual, height, itemHeight } = props;
127122
if (diffExpanded.add) {
128-
const keyIndex = prevData.findIndex(({ data: { key } }) => key === diffExpanded.key);
129-
123+
const keyIndex = prevData.findIndex(({ key }) => key === diffExpanded.key);
130124
const rangeNodes = getMinimumRangeTransitionRange(
131125
getExpandRange(prevData, data, diffExpanded.key),
132126
virtual,
@@ -141,7 +135,7 @@ export default defineComponent({
141135
transitionRange.value = rangeNodes;
142136
motionType.value = 'show';
143137
} else {
144-
const keyIndex = data.findIndex(({ data: { key } }) => key === diffExpanded.key);
138+
const keyIndex = data.findIndex(({ key }) => key === diffExpanded.key);
145139

146140
const rangeNodes = getMinimumRangeTransitionRange(
147141
getExpandRange(data, prevData, diffExpanded.key),
@@ -295,7 +289,7 @@ export default defineComponent({
295289
{...restProps}
296290
{...treeNodeProps}
297291
title={title}
298-
active={!!activeItem && key === activeItem.data.key}
292+
active={!!activeItem && key === activeItem.key}
299293
pos={pos}
300294
data={treeNode.data}
301295
isStart={isStart}

‎components/vc-tree/Tree.tsx

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -160,7 +160,6 @@ export default defineComponent({
160160
const flattenNodes = computed(() => {
161161
return flattenTreeData(treeData.value, expandedKeys.value, fieldNames.value);
162162
});
163-
164163
// ================ selectedKeys =================
165164
watchEffect(() => {
166165
if (props.selectable) {
@@ -499,10 +498,9 @@ export default defineComponent({
499498
cleanDragState();
500499

501500
if (dropTargetKey === null) return;
502-
503501
const abstractDropNodeProps = {
504502
...getTreeNodeProps(dropTargetKey, treeNodeRequiredProps.value),
505-
active: activeItem.value?.data.key === dropTargetKey,
503+
active: activeItem.value?.key === dropTargetKey,
506504
data: keyEntities.value[dropTargetKey].node,
507505
};
508506
const dropToChild = dragChildrenKeys.indexOf(dropTargetKey) !== -1;
@@ -663,7 +661,7 @@ export default defineComponent({
663661
new Promise<void>((resolve, reject) => {
664662
// We need to get the latest state of loading/loaded keys
665663
const { loadData, onLoad } = props;
666-
const { key } = treeNode;
664+
const key = treeNode[fieldNames.value.key];
667665

668666
if (
669667
!loadData ||
@@ -836,11 +834,11 @@ export default defineComponent({
836834
return null;
837835
}
838836

839-
return flattenNodes.value.find(({ data: { key } }) => key === activeKey.value) || null;
837+
return flattenNodes.value.find(({ key }) => key === activeKey.value) || null;
840838
});
841839

842840
const offsetActiveKey = (offset: number) => {
843-
let index = flattenNodes.value.findIndex(({ data: { key } }) => key === activeKey.value);
841+
let index = flattenNodes.value.findIndex(({ key }) => key === activeKey.value);
844842

845843
// Align with index
846844
if (index === -1 && offset < 0) {
@@ -851,7 +849,7 @@ export default defineComponent({
851849

852850
const item = flattenNodes.value[index];
853851
if (item) {
854-
const { key } = item.data;
852+
const { key } = item;
855853
onActiveChange(key);
856854
} else {
857855
onActiveChange(null);
@@ -894,7 +892,7 @@ export default defineComponent({
894892
if (expandable && expandedKeys.value.includes(activeKey.value)) {
895893
onNodeExpand({} as MouseEvent, eventNode);
896894
} else if (item.parent) {
897-
onActiveChange(item.parent.data.key);
895+
onActiveChange(item.parent.key);
898896
}
899897
event.preventDefault();
900898
break;
@@ -904,7 +902,7 @@ export default defineComponent({
904902
if (expandable && !expandedKeys.value.includes(activeKey.value)) {
905903
onNodeExpand({} as MouseEvent, eventNode);
906904
} else if (item.children && item.children.length) {
907-
onActiveChange(item.children[0].data.key);
905+
onActiveChange(item.children[0].key);
908906
}
909907
event.preventDefault();
910908
break;

‎components/vc-tree/TreeNode.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ export default defineComponent({
117117
isLeaf: isLeaf.value,
118118
};
119119
});
120+
const instance = getCurrentInstance();
120121
const eventData = computed(() => {
121122
return convertNodePropsToEventData(props);
122123
});
@@ -125,7 +126,7 @@ export default defineComponent({
125126
eventKey: computed(() => props.eventKey),
126127
selectHandle,
127128
pos: computed(() => props.pos),
128-
key: getCurrentInstance().vnode.key as Key,
129+
key: instance.vnode.key as Key,
129130
});
130131
expose(dragNodeEvent);
131132
const onSelectorDoubleClick = (e: MouseEvent) => {

‎components/vc-tree/util.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,10 +113,10 @@ export function calcDropPosition(
113113
if (clientY < top + height / 2) {
114114
// first half, set abstract drop node to previous node
115115
const nodeIndex = flattenedNodes.findIndex(
116-
flattenedNode => flattenedNode.data.key === abstractDropNodeEntity.key,
116+
flattenedNode => flattenedNode.key === abstractDropNodeEntity.key,
117117
);
118118
const prevNodeIndex = nodeIndex <= 0 ? 0 : nodeIndex - 1;
119-
const prevNodeKey = flattenedNodes[prevNodeIndex].data.key;
119+
const prevNodeKey = flattenedNodes[prevNodeIndex].key;
120120
abstractDropNodeEntity = keyEntities[prevNodeKey];
121121
}
122122

‎components/vc-tree/utils/diffUtil.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,12 +33,12 @@ export function findExpandedKeys(prev: Key[] = [], next: Key[] = []) {
3333
}
3434

3535
export function getExpandRange(shorter: FlattenNode[], longer: FlattenNode[], key: Key) {
36-
const shorterStartIndex = shorter.findIndex(({ data }) => data.key === key);
36+
const shorterStartIndex = shorter.findIndex(item => item.key === key);
3737
const shorterEndNode = shorter[shorterStartIndex + 1];
38-
const longerStartIndex = longer.findIndex(({ data }) => data.key === key);
38+
const longerStartIndex = longer.findIndex(item => item.key === key);
3939

4040
if (shorterEndNode) {
41-
const longerEndIndex = longer.findIndex(({ data }) => data.key === shorterEndNode.data.key);
41+
const longerEndIndex = longer.findIndex(item => item.key === shorterEndNode.key);
4242
return longer.slice(longerStartIndex + 1, longerEndIndex);
4343
}
4444
return longer.slice(longerStartIndex + 1);

‎components/vc-tree/utils/treeUtil.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -401,6 +401,7 @@ export function convertNodePropsToEventData(props: TreeNodeProps): EventDataNode
401401
dragOverGapBottom,
402402
pos,
403403
active,
404+
eventKey,
404405
} = props;
405406
const eventData = {
406407
dataRef: data,
@@ -416,7 +417,7 @@ export function convertNodePropsToEventData(props: TreeNodeProps): EventDataNode
416417
dragOverGapBottom,
417418
pos,
418419
active,
419-
eventKey: data.key,
420+
eventKey,
420421
};
421422
if (!('props' in eventData)) {
422423
Object.defineProperty(eventData, 'props', {

0 commit comments

Comments
 (0)