chuan/Cli-Proxy-API-Management-Center
1
0
Fork 0
mirror of https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git synced 2026-06-16 21:03:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(config): stabilize string list item keys

Browse Source
This commit is contained in:
Supra4E8C
2026-03-07 14:19:33 +08:00
parent 033be261f5
commit ac44308fbd
1 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/config/VisualConfigEditor.tsx
+15 -3
View File
@@ -289,16 +289,28 @@ function StringListEditor({
}) {
const { t } = useTranslation();
const items = value.length ? value : [];
const [itemIds, setItemIds] = useState(() => items.map(() => makeClientId()));
const renderItemIds = useMemo(() => {
if (itemIds.length === items.length) return itemIds;
if (itemIds.length > items.length) return itemIds.slice(0, items.length);
return [...itemIds, ...Array.from({ length: items.length - itemIds.length }, () => makeClientId())];
}, [itemIds, items.length]);
const updateItem = (index: number, nextValue: string) =>
onChange(items.map((item, i) => (i === index ? nextValue : item)));
const addItem = () => onChange([...items, '']);
const removeItem = (index: number) => onChange(items.filter((_, i) => i !== index));
const addItem = () => {
setItemIds([...renderItemIds, makeClientId()]);
onChange([...items, '']);
};
const removeItem = (index: number) => {
setItemIds(renderItemIds.filter((_, i) => i !== index));
onChange(items.filter((_, i) => i !== index));
};
return (
<div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
{items.map((item, index) => (
<div key={index} style={{ display: 'flex', gap: 8, alignItems: 'center', flexWrap: 'wrap' }}>
<div key={renderItemIds[index] ?? `item-${index}`} style={{ display: 'flex', gap: 8, alignItems: 'center', flexWrap: 'wrap' }}>
<input
className="input"
placeholder={placeholder}