Can't give only the value in props, it's only working with full object option

For these options:

const options = [{ value: 1, label: "one" }, { value: 2, label: "Two" }]

In React Select v1.x.x, you could do this to select the first option:

<Select
  value={1}
  options={options}
/>

Now in React Select v2, you have to do this:

<Select
  value={{ value: 1, label: "one" }}
  options={options}
/>

I guess it’s a bug since it’s not documented anywhere (not mentionned in Upgrade Guide).

Non-working example: https://codesandbox.io/s/l946w963r7

[waynebloss]

Taking away the simple value as the default functionality was a bad decision.

I think someone needs to fork this library and put it back the way it was. Anyone willing to help with this?

[dreallday]

I ended up going this route:

Props with full object options, and value is an array of values;

props = {
    options = [{value: x, label: y}, ...];
    value: [x, ...]
}

getValue returns the proper {value: x, label: y} objects for values;

const getValue = (opts, val) => {
  return opts.filter(o => val.includes(o.value));
};

renderable

  return (
    <Select
      options={props.options}
      onChange={props.onChange}
      isMulti
      isDisabled={props.disabled}
      placeholder={label}
      value={getValue(props.options, props.value)}
      style={{ width: '80%', margin: '30px 0' }}
    />
  );