Заставить TextField выделить полный текст в фокусе

Question

Я бы хотел, чтобы TextField выделял весь текст, находящийся в данный момент в поле, всякий раз, когда я щелкаю / нажимаю / фокусируюсь на поле. Я сам делал это в других приложениях React с обработчиком onFocus, который выполняет event.target.select(), но этот подход, похоже, не работает с Material-UI. С помощью TextFields Material-UI я вижу, что выделение кратко покрывает полный текст, затем оно возвращается к просто мигающему курсору в конце текста.

Есть идеи, как заставить это работать?

Answer 1

Это прекрасно работает для меня, используя следующий код:

import React from "react";
import ReactDOM from "react-dom";
import TextField from "@material-ui/core/TextField";

function App() {
  return (
    <TextField
      defaultValue="test"
      onFocus={event => {
        event.target.select();
      }}
    />
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Если это не помогло решить вашу проблему, поделитесь кодом, который воспроизводит вашу проблему.