Фокус Выберите элемент

Question

Я пытаюсь программно сфокусировать выбранный элемент в Material-UI в блоке useEffect.

Попытка передать ссылку на сам компонент (ref={my ref}) ничего не делает, и пытается передать любой Разнообразие inputProps={{ ref: myRef }}, inputProps={{ inputRef: myRef }} выдает ошибку , поскольку displayNode не определен, когда я вызываю focus () для ссылки.

Я уверен, что есть что-то очевидное, что мне не хватает, что будет правильный синтаксис / способ сделать это?

const MyCard = ({
  disabled,
}) => {
  const inputField = React.useRef(null);

  React.useEffect(() => {
    if (!disabled && inputField.current) {
      inputField.current.focus();
    }
  }, [inputField, disabled]);

  return (
    <Select
      disabled={disabled}
      inputProps={{ ref: inputField }}
      required
      id="answer"
      name="answer"
      autoComplete='off'
      autoFocus
    >
      <MenuItem value="option1">option1</MenuItem>
      <MenuItem value="option2">option2</MenuItem>
    </Select>
  )
}

Дополнительная информация от OP:

Мне нужно иметь возможность программно сфокусировать выбор. Автофокус у меня работает при начальном рендере, но не впоследствии, в частности, я пытаюсь перефокусировать ввод после удаления отключенного пропеллера.

Answer 1

Перед вызовом focus:

useEffect(() => {
  if (myRef.current) {
    myRef.current.focus()
  }
}, [myRef])

убедитесь, что оно определено