将部分计算增加判断,只有传入对应方法真正需要获取值的时候才进行计算,避免不必要的计算

将对树形结构数据处理使用useMemo缓存
master
LiuJiaNan 2026-02-06 18:02:30 +08:00
parent 4f7a81d81c
commit d52b7911a9
4 changed files with 78 additions and 60 deletions

View File

@ -1,5 +1,5 @@
import { Cascader } from "antd";
import { useEffect } from "react";
import { useEffect, useMemo } from "react";
import { processTreeDataByLevel } from "../../../utils";
/**
@ -21,7 +21,8 @@ function BasicCascader(props) {
} = props;
// 根据 level 处理树数据
const processedData = level
const processedData = useMemo(() => {
return level
? processTreeDataByLevel({
data,
level,
@ -29,6 +30,7 @@ function BasicCascader(props) {
currentLevel: 1,
})
: data;
}, [data, level, childrenKey]);
const getNodePaths = (selectedOptions) => {
let nodePaths = selectedOptions;
@ -39,8 +41,10 @@ function BasicCascader(props) {
};
const handleChange = (value, selectedOptions) => {
if (selectedOptions && onGetNodePaths) {
const parentNodes = getNodePaths(selectedOptions);
onGetNodePaths?.(parentNodes);
}
onChange?.(value, selectedOptions);
};

View File

@ -74,7 +74,7 @@ const BasicLeftTree = (props) => {
};
const handleSelect = (selectedKeys, event) => {
if (selectedKeys.length > 0) {
if (selectedKeys.length > 0 && onGetNodePaths) {
const selectedNodeId = selectedKeys[0];
const parentNodes = getTreeNodePaths({
data: treeData,

View File

@ -19,6 +19,7 @@ function BasicSelect(props) {
} = props;
const handleChange = (event, option) => {
if (onGetLabel || onGetOption) {
if (Array.isArray(event)) {
if (event.length > 0) {
const findItems = [];
@ -49,6 +50,7 @@ function BasicSelect(props) {
onGetOption?.({});
}
}
}
onChange?.(event, option);
};

View File

@ -1,5 +1,5 @@
import { TreeSelect } from "antd";
import { useEffect } from "react";
import { useEffect, useMemo } from "react";
import { arrayObjectDeduplication, getDataType, getTreeNodePaths, processTreeDataByLevel, processTreeDataForOnlyLastLevel } from "../../../utils";
/**
@ -22,8 +22,9 @@ function BasicSelectTree(props) {
...restProps
} = props;
const processedTreeData = useMemo(() => {
// 根据 level 处理树数据
let processedTreeData = level
let result = level
? processTreeDataByLevel({
data: treeData,
level,
@ -33,11 +34,19 @@ function BasicSelectTree(props) {
: treeData;
// 根据 onlyLastLevel 处理树数据
processedTreeData = processTreeDataForOnlyLastLevel({ data: processedTreeData, childrenKey, onlyLastLevel });
result = processTreeDataForOnlyLastLevel({
data: result,
childrenKey,
onlyLastLevel,
});
return result;
}, [treeData, level, childrenKey, onlyLastLevel]);
const handleChange = (value, label, extra) => {
if (value) {
if (getDataType(value) === "Array") {
if (onGetNodePaths) {
const parentNodes = [];
for (let i = 0; i < value.length; i++) {
const targetId = (restProps.labelInValue || restProps.treeCheckStrictly) ? value[i].value : value[i];
@ -52,9 +61,11 @@ function BasicSelectTree(props) {
}
const deduplicationParentNodes = arrayObjectDeduplication(parentNodes, idKey);
onGetNodePaths?.(deduplicationParentNodes);
}
onGetLabel?.((restProps.labelInValue || restProps.treeCheckStrictly) ? value.map(item => item.label) : label);
}
else {
if (onGetNodePaths || onGetLabel) {
const targetId = (restProps.labelInValue || restProps.treeCheckStrictly) ? value.value : value;
const parentNodes = getTreeNodePaths({
data: treeData,
@ -67,6 +78,7 @@ function BasicSelectTree(props) {
onGetLabel?.(parentNodes[parentNodes.length - 1][nameKey]);
}
}
}
else {
onGetNodePaths?.([]);
onGetLabel?.("");