Как стиль реагирует на автозаполнение поля ввода?

Question

Я пытаюсь использовать ответ-автозаполнение в моем компоненте.Все работает отлично, результаты показаны.Но я не могу стилизовать поле ввода по умолчанию.Это автозаполнение

<Autocomplete 
getItemValue={this.getItemValue}
items={this.state.autocompleteData}
renderItem={this.renderItem}
value={this.state.value}
onChange={this.onChange}
onSelect={this.onSelect} 
menuStyle={menuStyle}
/> 

Стиль для выпадающего меню работает нормально.

const menuStyle = {
  borderRadius: '3px',
  boxShadow: '0 2px 12px rgba(0, 0, 0, 0.1)',
  background: 'rgba(255, 255, 255, 0.9)',
  padding: '2px 0',
  fontSize: '90%',
  position: 'fixed',
  overflow: 'auto',
  maxHeight: '50%', // TODO: don't cheat, let it flow to the bottom
  "zIndex": 100,
};

Я пытался добавить стиль согласно ответу в этом вопросе, но он не работает. как увеличить размер вводимого текстового поля в реакции автозаполнения?

Как добавить стиль в поле ввода?

Answer 1

Объект, заданный для prop inputProps, используется в качестве реквизита для ввода, поэтому вы можете присвоить этому объекту свойство style, содержащее ваш menuStyles.

<Autocomplete
  getItemValue={this.getItemValue}
  items={this.state.autocompleteData}
  renderItem={this.renderItem}
  value={this.state.value}
  onChange={this.onChange}
  onSelect={this.onSelect}
  inputProps={{ style: menuStyle }}
/>