使用React Material UI自动聚焦文本字段

Question

我使用材质UI文本字段

我想实现一个自动对焦，我找不到一种方法通过设置autofocus=true而不是通过编程来实现。有什么帮助吗？

Answer 1

我只是简单地将输入的ref放入状态

然后，您可以将焦点设置为输入的任意位置。

这个。状态类型focus（）

Answer 2

出于某种原因，这对我不起作用（可能是因为它在一个组件中，当顶级组件挂载时不可见）。我不得不做一些更复杂的事情来让它工作：

const focusUsernameInputField = input => {
  if (input) {
    setTimeout(() => {input.focus()}, 100);
  }
};

return (
  <TextField
    hintText="Username"
    floatingLabelText="Username"
    ref={focusUsernameInputField}
  />
)

更多信息见https://github.com/callemall/material-ui/issues/1594.

Answer 3

您可以这样做：

更多关于这个：https://facebook.github.io/react/docs/tags-and-attributes.html#html-attributes.