在组件渲染后，react如何设置聚焦在特定文本字段上?
文档似乎建议使用参考，例如:
在渲染函数的输入字段上设置ref="nameInput"，然后调用:
this.refs.nameInput.getInputDOMNode().focus();
但是我该把它叫什么呢?我在几个地方试过了，但都不行。
当前回答
我也有同样的问题，但我也有一些动画，所以我的同事建议使用window.requestAnimationFrame
这是元素的ref属性:
ref={(input) => {input && window.requestAnimationFrame(()=>{input.focus()})}}
其他回答
从React 0.15开始，最简洁的方法是:
<input ref={input => input && input.focus()}/>
@Dhiraj的答案是正确的，为了方便，你可以使用自动对焦道具在安装时自动对焦:
<input autoFocus name=...
注意，在jsx中，它是自动聚焦(大写F)，不像普通的旧html是不区分大小写的。
ReactDOMComponent:不要访问DOM节点的.getDOMNode();相反，直接使用节点。这个DOM节点由App渲染。
应该是
componentDidMount: function () {
this.refs.nameInput.focus();
}
由于这个错误有很多原因，我想我也会发布我所面临的问题。对我来说，问题是我将我的输入呈现为另一个组件的内容。
export default ({ Content }) => {
return (
<div className="container-fluid main_container">
<div className="row">
<div className="col-sm-12 h-100">
<Content /> // I rendered my inputs here
</div>
</div>
</div>
);
}
这是我调用上述组件的方式:
<Component Content={() => {
return (
<input type="text"/>
);
}} />
React文档现在有一个专门的部分。https://facebook.github.io/react/docs/more-about-refs.html#the-ref-callback-attribute
render: function() {
return (
<TextInput
ref={function(input) {
if (input != null) {
input.focus();
}
}} />
);
},
