Есть ли способ принудительного выбора, т. Е. Запрет на ввод произвольного текста в компонент TypeAHead? - PullRequest
Новая
       59

Есть ли способ принудительного выбора, т. Е. Запрет на ввод произвольного текста в компонент TypeAHead?

0 голосов
/ 28 апреля 2020

Для типа реакции - bootstrap. Существует ли способ принудительного выбора из раскрывающегося списка, т. Е. Запрет на ввод произвольного текста в компонент TypeAHead?

1 Ответ

0 голосов
/ 29 апреля 2020

Похоже, вы пытаетесь заставить typeahead работать больше как поле select. Если так, то есть несколько вещей для этого. Вы можете сделать ввод только для чтения, чтобы отключить ввод. Вы также захотите изменить фильтрацию так, чтобы все опции появлялись в меню, даже когда есть выбор: 

<Typeahead
  ...
  filterBy={(option, state) => {
    if (state.selected.length) {
      return true;
    }
    return option.label.toLowerCase().indexOf(state.text.toLowerCase()) > -1;
  }}
  inputProps={{
    readOnly: true,
  }}
/>

Это поможет вам пройти большую часть пути, хотя вы можете захотеть добавьте несколько дополнительных стилей, чтобы ввод только для чтения выглядел более интерактивным.

Вот рабочий пример: https://codesandbox.io/s/rbt-select-example-nfc5q?file= / src / index. js

...