Я хочу использовать Autocomplete
компонент для ввода тегов. Я пытаюсь получить теги и сохранить их в состоянии, чтобы потом можно было сохранить их в базе данных. Я использую функции вместо классов в реакции. Я пытался onChange
, но я не получил никакого результата.
<div style={{ width: 500 }}>
<Autocomplete
multiple
options={autoComplete}
filterSelectedOptions
getOptionLabel={option => option.tags}
renderInput={params => (<TextField
className={classes.input}
{...params}
variant="outlined"
placeholder="Favorites"
margin="normal"
fullWidth />)} />
reactjs
material-ui
Бук Лау
источник
источник
Вы уверены, что
onChange
правильно использовали ?onChange
подпись :function(event: object, value: any) => void
источник
@Dworo
Для тех, у кого есть проблемы с отображением выбранного элемента из выпадающего списка в поле ввода.
Я нашел обходной путь. По сути, вы должны связать
inputValue
какonChage
для, такAutocomplete
и дляTextField
дерьмового пользовательского интерфейса.источник
После использования приведенного выше кода, я все еще не могу получить окно автозаполнения для отображения выбранной опции. Есть идеи, ребята?
источник
Мне нужно было нажимать мой API на каждом входном изменении, чтобы получить свои теги от бэкэнда!
Используйте Material-ui onInputChange, если вы хотите получать предлагаемые теги при каждом изменении ввода!
источник
Я хотел обновить свое состояние, когда я выбираю опцию из автозаполнения. У меня был глобальный обработчик onChange, который управляет всеми входами
Это обновляет объект динамически на основе имени поля. Но при автозаполнении имя возвращается пустым. Поэтому я изменил обработчик с
onChange
наonSelect
. Затем либо создайте отдельную функцию для обработки изменения, либо, как в моем случае, добавьте оператор if, чтобы проверить, не передано ли имя.Вышеупомянутый подход работает, если у вас есть одно автозаполнение. Если у вас есть несколько, вы можете передать пользовательскую функцию, как показано ниже
источник