Merge pull request #4731 from sgadman/multi-value-key

MultiValue key - made more unique by adding a hyphen
JedWatson · Sep 3, 2021 · 117d4bb · 117d4bb
2 parents ed15c73 + 59cdba8
commit 117d4bb
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.changeset/gold-tomatoes-smoke.md b/.changeset/gold-tomatoes-smoke.md
@@ -0,0 +1,5 @@
+---
+'react-select': patch
+---
+
+MultiValue key now includes a hyphen between the value and the index to prevent edge cases where you could get a duplicate key error
diff --git a/packages/react-select/src/Select.tsx b/packages/react-select/src/Select.tsx
@@ -1659,7 +1659,7 @@ export default class Select<
             }}
             isFocused={isOptionFocused}
             isDisabled={isDisabled}
-            key={`${this.getOptionValue(opt)}${index}`}
+            key={`${this.getOptionValue(opt)}-${index}`}
             index={index}
             removeProps={{
               onClick: () => this.removeValue(opt),