优化Select

master
LiuJiaNan 2025-11-07 15:09:53 +08:00
parent 4ddef4178d
commit f98dbd9a85
2 changed files with 21 additions and 7 deletions

View File

@ -15,6 +15,8 @@ export interface BasicSelectProps extends SelectProps {
placeholder?: string; placeholder?: string;
/** 获取 label */ /** 获取 label */
onGetLabel?: (label: string | string[]) => void; onGetLabel?: (label: string | string[]) => void;
/** 获取选中的项 */
onGetOption?: (option: Record<string, any> | Record<string, any>[]) => void;
/** 获取数据 */ /** 获取数据 */
onGetData?: (data: Record<string, any>[]) => void; onGetData?: (data: Record<string, any>[]) => void;
} }

View File

@ -1,6 +1,5 @@
import { Select } from "antd"; import { Select } from "antd";
import { useEffect } from "react"; import { useEffect } from "react";
import { getLabelName } from "../../../utils";
/** /**
* 基础下拉组件不建议直接使用此组件二次继承使用 * 基础下拉组件不建议直接使用此组件二次继承使用
@ -10,6 +9,7 @@ function BasicSelect(props) {
onGetData, onGetData,
onChange, onChange,
onGetLabel, onGetLabel,
onGetOption,
placeholder = "", placeholder = "",
data = [], data = [],
nameKey = "name", nameKey = "name",
@ -20,21 +20,33 @@ function BasicSelect(props) {
const handleChange = (event, option) => { const handleChange = (event, option) => {
if (Array.isArray(event)) { if (Array.isArray(event)) {
if (event.length > 0) { if (event.length > 0) {
const name = []; const findItems = [];
const names = [];
event.forEach((item) => { event.forEach((item) => {
name.push(getLabelName({ list: data, status: item, idKey, nameKey })); const findItem = data.find(dataItem => dataItem[idKey] === item);
if (findItem) {
findItems.push(findItem);
names.push(findItem[nameKey]);
}
}); });
onGetLabel?.(name); onGetLabel?.(names);
onGetOption?.(findItems);
} }
else { else {
onGetLabel?.([]); onGetLabel?.([]);
onGetOption?.([]);
} }
} }
else { else {
if (event) if (event) {
onGetLabel?.(getLabelName({ list: data, status: event, idKey, nameKey })); const findItem = data.find(item => item[idKey] === event);
else onGetLabel?.(findItem[nameKey]);
onGetOption?.(findItem);
}
else {
onGetLabel?.(""); onGetLabel?.("");
onGetOption?.({});
}
} }
onChange?.(event, option); onChange?.(event, option);
}; };