Как сохранить прерывистый текст на `реагировать-выбрать`?

Question

Я использую приведенный ниже код для визуализации компонента react-select с множественным выбором.Но я обнаружил, что когда я набираю какие-либо символы и оставляю фокус перед выбором каких-либо элементов, символы не сохраняются.

import React from 'react';

import Select from 'react-select';
import makeAnimated from 'react-select/animated';
import { colourOptions } from '../data';

const animatedComponents = makeAnimated();

export default function AnimatedMulti() {
  return (
    <Select
      closeMenuOnSelect={false}
      components={animatedComponents}
      defaultValue={[colourOptions[4], colourOptions[5]]}
      isMulti
      options={colourOptions}
    />
  );
}

В качестве примера, см. Скриншот ниже.Я набрал f и переместил фокус на другой компонент.Тогда f будет удален из выбранного компонента.Есть ли способ сохранить f, когда он теряет фокус?

Answer 1

Вы можете достичь этого, комбинируя реквизиты inputValue, value, onInputChange и onChange.

Примерно так

<Select
  value={this.state.value}
  onChange={value => this.setState({ value })}
  inputValue={this.state.inputValue}
  onInputChange={inputValue => this.setState({ inputValue })}
/>

Подробнее об этом можно прочитать в документах