ReactJS和自动对焦 [英] ReactJS and autofocus

问题描述

我有一个带有<input>的react-bootstrap模态.我想在<input>

I have a react-bootstrap modal with an <input>. I want to set the autofocus attribute on the <input>

以下工作正常，但在控制台中显示警告

The following works fine, but shows a warning in the console

<input type="text" autofocus='true' />

Warning: Invalid DOM property `autofocus`. Did you mean `autoFocus`?

以下选项不起作用，因为它们在打开模式时不会集中输入内容:

The following options do not work, in the sense that they do not focus the input when opening the modal:

<input type="text" autoFocus='true' />
<input type="text" autoFocus={true} />
<input type="text" autoFocus />

设置自动对焦的推荐方法是什么.还是我应该忽略效果良好的示例的警告?

What is the recommended way of setting autofocus. Or how should I mute the warnings for the example that works well?

注意:这是反应16.8.6

Note: This is react 16.8.6

推荐答案

Refs 是您想要的，

Refs is what you want,

constructor(props) {
    super(props);
    this.myRef = React.createRef();
}

componentDidMount(){
  this.myRef.current.focus();
}

<input type="text"  ref={this.myRef} />

这篇关于ReactJS和自动对焦的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！