1
0
Эх сурвалжийг харах

fix: add child key to restGroupProps to make group key uniq (#2854)

YannLynn 4 сар өмнө
parent
commit
137a647142

+ 19 - 0
packages/semi-ui/select/_story/select.stories.jsx

@@ -3720,3 +3720,22 @@ export const fix2465 = () => {
         </div>
     );
 }
+
+
+export const Fix2853 = () => {
+  return (
+    <Select placeholder="" style={{ width: 180 }} filter>
+        <Select.OptGroup key="a" label={<div>a</div>} >
+            <Select.Option value="a-1" key="a-1">a-1</Select.Option>
+            <Select.Option value="a-2" key="a-2">a-2</Select.Option>
+        </Select.OptGroup>
+        <Select.OptGroup label={<div>b</div>} >
+            <Select.Option value="b-1">b-1</Select.Option>
+            <Select.Option value="b-2">b-2</Select.Option>
+        </Select.OptGroup>
+        <Select.OptGroup label={<div>c</div>} >
+            <Select.Option value="c-1">c-1</Select.Option>
+        </Select.OptGroup>
+    </Select>
+  )
+}

+ 4 - 1
packages/semi-ui/select/index.tsx

@@ -908,8 +908,11 @@ class Select extends BaseComponent<SelectProps, SelectState> {
             const parentGroup = option._parentGroup;
             const optionContent = this.renderOption(option, optionIndex);
             if (parentGroup && !groupStatus.has(parentGroup.label)) {
+                const groupKey = typeof parentGroup.label === 'string' || typeof parentGroup.label === 'number'
+                    ? parentGroup.label
+                    : parentGroup.key;
                 // when use with OptionGroup and group content not already insert
-                const groupContent = <OptionGroup {...parentGroup} key={parentGroup.label} />;
+                const groupContent = <OptionGroup {...parentGroup} key={groupKey}/>;
                 groupStatus.set(parentGroup.label, true);
                 content.push(groupContent);
             }

+ 1 - 0
packages/semi-ui/select/utils.tsx

@@ -55,6 +55,7 @@ const getOptionsFromGroup = (selectChildren: React.ReactNode) => {
             type = 'group';
             // Avoid saving children (reactNode) by... removing other props from the group except children, causing performance problems
             let { children, ...restGroupProps } = child.props;
+            restGroupProps.key = child.key;
             let originKeys = [];
             if (Array.isArray(children)) {
                 // if group has children > 1