React專注於子組件輸入

Question

我目前實現Redux-Form以便將InputFields添加到我的應用程序。是否有辦法手動關注子組件的輸入？

代碼添加子組件：

<Field name="Quantity" ref="quantity" onKeyPress={(event) => this.handleKeyPress('inventory', event)} component={ InputField }/> 

代碼子組件：

render() { 
    const { input } = this.props; 
    const inputClass = classNames({ 'parsley-error': this.props.meta.touched && this.props.meta.error }, 'form-control') 
return (
    <div> 
     {this.props.meta.touched && this.props.meta.error && <span className="parsley-error-message">{this.props.meta.error}</span>} 
     <Input {...input} className={inputClass} onKeyPress={this.props.onKeyPress} standalone type="text" placeholder={this.props.placeholder}/> 
    </div> 
    ) 
} 

當前實現企圖焦點：

handleKeyPress(value, event){ 
    if(event.charCode == 13){ 
    this.refs["inventory"].getDOMNode().focus(); 
    } 
} 

我硬編碼爲重點庫存只爲測試目的

Answer 1

內，您的輸入組件，你應該能夠做到：

`<input type="text" autoFocus />` 

注意F的資本化。我沒有對新生成的組件進行測試，但理論上它應該起作用。