Reactjs 如何添加添加键以反应选择多个？

如何添加key元素以使用ismulti响应select，因此当我选择多个选项时，它不会给我此错误“警告：遇到两个具有相同键的子项，

[object]

。密钥应该是唯一的，以便组件在更新过程中保持其标识。非唯一密钥可能会导致子项被复制和/或省略-不支持该行为，并且可能在将来的版本中更改。”

这是我的密码：

         let options = data.map( (item,index) => (
             { index: item.name, value: item, label: item.name })
             );
   
      setOptions(options);

在返回部分，我是如何设置react select的

 <Select 
        
            value={selectedOptions || ''}       
            className="select-name"
            isMulti
            name="selectedOption"
            onChange={handleChange}
            isClearable             
            options={Options}              
        />

提前感谢您的帮助。

在github上有关于同一问题的讨论建议

本质上，您需要向用作选项中的值的对象添加一个

toString

方法。这允许您控制键的格式（否则通过将

值

属性强制转换为字符串生成，因此复制的

[object object]

键）

在您的情况下，它可能看起来像这样：

const options = data.map((item, index) => ({
  index: item.name,
  value: {
    ...item,
    toString: () => item.id // assumes item has a unique id property
  },
  label: item.name
}));

setOptions(options);

在github上有一个关于同一问题的讨论建议

本质上，您可以向用作选项中的值的对象添加

toString

方法。这允许您控制键的格式（否则将

value

属性强制转换为字符串，从而生成重复的

[object object]

键）

在您的情况下，它可能看起来像这样：

const options = data.map((item, index) => ({
  index: item.name,
  value: {
    ...item,
    toString: () => item.id // assumes item has a unique id property
  },
  label: item.name
}));

setOptions(options);