Как получить событие, «сфокусированное на опциях» с автозаполнением Material-UI?

Question

Это примерно Автозаполнение Material-UI . Мне нужно событие, сообщающее мне, какой вариант автозаполнения выбирает пользователь в данный момент, либо наведя указатель мыши на параметр, либо используя стрелки клавиатуры (т. Е. До того, как он фактически щелкнет по нему или нажмет Enter). Я перепробовал кучу вещей, казалось, что это должно работать, но событие не срабатывает:

<Autocomplete
  renderOption={option => (
    <div onFocus={() => console.log('option onFocus')}>{option}</div>
  )}/>

Как бы вы go сделали это?

Answer 1

Вы можете использовать onMouseOver для достижения hovering the mouse over the option

renderOption={(option, { selected }) => (
  <>
    <div onMouseOver={() => {console.log(option.name)}}>
      {option.name}
    ...

Попробуйте онлайн: https://stackblitz.com/edit/fvvowt-e4cwgb
, который является прямой веткой официальной демонстрации в их документе.