Если я нажму за пределами поля ввода автозаполнения пользовательского интерфейса материала, то весь текст поля ввода исчезнет

#reactjs #material-ui

Вопрос:

Я использую компонент автозаполнения пользовательского интерфейса Material. Поэтому, если вы напишете что-то в этом поле, а затем нажмете в любом месте за пределами этого поля ввода, ваши тексты полей ввода только что были удалены.Как я могу решить эту проблему?

 import React from 'react';
import TextField from '@material-ui/core/TextField';
import Autocomplete, { createFilterOptions } from '@material-ui/lab/Autocomplete';

export default function Filter() {
  return (
    <Autocomplete
      id="filter-demo"
      options={top100Films}
      getOptionLabel={(option) => option.title}
      filterOptions={x => x}
      style={{ width: 300 }}
      renderInput={(params) => <TextField {...params} label="Custom filter" variant="outlined" />}
    />
  );
}
 

посмотрите прилагаемое изображение для лучшего понимания

Комментарии:

1. пожалуйста, покажите подробный код

Ответ №1:

Просто смог решить проблему, с которой столкнулся. Просто добавьте функцию clearOnBlur={false} внутри компонента автозаполнения, чтобы выполнить эту работу.