將redux表單元素放在按鈕上

Question

我正在使用以下代碼使用redux-form生成輸入字段

    import { Field } from 'redux-form';
    focusForm(){
    }

    <Field
        onClick={() => this.showMessage()}
        placeholder={this.props.placeholderText}
        ref="qaQuery"
        className="form-control"
        type="text"
        component="input"
        name={"inputField"}
        id={this.props.name}
    />
    <Button onClick={() => focusForm()}

我想把重點放在按鈕的點擊上。 我們如何實現這一目標。 我嘗試了以下選項：

this.refs['qaQuery'].focus() //Not working - return Field and not actual input filed
document.querySelector("input[name='inputFileName']").focus(); //bad method

請幫助我實現這一目標，謝謝

Answer 1

以下是我的答案：

import { Field } from 'redux-form';
    focusForm(){
        this.refs['qaQuery'].getRenderedComponent().focus();
    }

    <Field
        onClick={() => this.showMessage()}
        placeholder={this.props.placeholderText}
        ref="qaQuery"
        className="form-control"
        type="text"
        component="input"
        name={"inputField"}
        id={this.props.name}
    />
    <Button onClick={() => focusForm()}