Как адаптировать multiselect для одномерного массива?

Я пытаюсь сделать мультиселект

export  const Example:React.FC=()=> {
  
  const Option = (props:any) => {
    return (
      <div>
        <components.Option {...props}>
          <input
            type="checkbox"
            checked={props.isSelected}
            onChange={() => null}
          />{" "}
          <label>{props.label}</label>
        </components.Option>
      </div>
    );
  };

const [Region,setRegion]=useState([]);
const regionBD=useSelector((s:Rootstate)=>s.Bd.Region);

 const handleChange = (selected:any) => {
    setRegion(selected)
  };


    return (
      <span
        class="d-inline-block"
        data-toggle="popover"
        data-trigger="focus"
        data-content="Please selecet account(s)"
      >
        <ReactSelect
          options={regionBD}
          isMulti
          closeMenuOnSelect={false}
          hideSelectedOptions={false}
          components={{
            Option
          }}
          onChange={handleChange}
          allowSelectAll={true}
          value={Region}
        />
      </span>
    );
  }

Но в примере там передавалась такая переменная

 const col=[{label:"asa",value:"123"}
              {label:"asa1",value:"123"}];

Пробую передавать мой массив regionBD но выводит ошибку Warning: Each child in a list should have a unique "key" prop.

И checkbox не разделены и при нажатии одного выбираются все.

Как передать одномерный массив, ну или как можно переделать существующий чтобы работало?


Ответы (0 шт):