将具有多个相同值的选项传递给 React-select答案

【问题标题】：Passing options with multiple values that are the same in to React-select将具有多个相同值的选项传递给 React-select
【发布时间】：2019-02-13 12:16:04
【问题描述】：

以下是我如何调用“选择”菜单的 sn-p：

import Select from 'react-select';

const SelectMenu = (props) => {
  const { options, defaultValue, onChange, name, label } = props;
  return (  
      <Select
        options={options}
        defaultValue={defaultValue}
        onChange={onChange}
        name={name}
        id="search-select"
      />
  );
};

我的选项对象如下所示：

TestObj: [
  {
    label: 'Test 1',
    value: 3.49
  },
  {
    label: 'Test 2',
    value: 3.99
  },
  {
    label: 'Test 3',
    value: 3.89
  },
  {
    label: 'Test 4',
    value: 3.99
  },
  {
    label: 'Test 5',
    value: 0
  }
]

由于两个选项共享相同的值，我得到了这个效果：

可以看出，由于测试 2 和 4 共享相同的值，它们都显示为选中。

有没有一种方法可以在保持相同值的同时让它只选择实际选择的选项？

【问题讨论】：

标签： reactjs react-select

【解决方案1】：

react-select 默认检查是否选择了值的方式是提取 value 片段并将其与选择的内容（具有值键的对象数组）进行比较。

使用isOptionSelected，您可以覆盖所采用的策略：

isOptionSelected={(option, selectValue) => selectValue.some(i => i === option)}

这或多或少是内部函数在不提取value 部分的情况下的工作方式，而是比较整个对象。

【讨论】：