Проверка Redux-формы при отправке

У меня проблема, когда, когда я наводю указатель мыши на текстовое поле, а затем убираю фокус, отображается ошибка проверки. Я хочу добиться того, чтобы пользователь просто отправил форму или нажал кнопку отправки. Это время, когда произойдет проверка.

Вот мой код:

const form = reduxForm({
    form: 'BoardAddModalForm',
    validate
});

const renderField = field => (
    <div className="form-group">
        <input className={[forms.inputTextboxMd,"form-control"].join(' ')} {...field.input} type={field.type} placeholder={field.placeholder} autoComplete="off" />
        <div className={utils.errorText}>{field.meta.touched && field.meta.error && <span>{field.meta.error}</span>}</div>
    </div>
);

function validate(formProps){
    const errors = {};

    if(!formProps.name){
        errors.name = "Board name is required";
    }

    return errors;
}
class BoardAddModal extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            name: ''
        };
    }

    addBoard(formProps) {
        this.props.dispatch(reset('BoardAddModalForm'));
    }

    render() {

        const { error, handleSubmit } = this.props;
        return (
        <Modal show={this.props.show} onHide={this.props.onHide} bsSize="small" aria-labelledby="contained-modal-title-sm">
            <Modal.Header closeButton>
                <Modal.Title id="contained-modal-title-sm">Create Board</Modal.Title>
            </Modal.Header>
            <Modal.Body>
                <form onSubmit={handleSubmit(this.addBoard.bind(this))}>

                    <Field name="name" component={renderField} type="text" placeholder="What are you organizing" />
                    <button className="btn">Submit</button>
                </form>

            </Modal.Body>
        </Modal>
        );
    }
}

export default (form(BoardAddModal));

person Sydney Loteria    schedule 24.12.2016    source источник


Ответы (1)


Установите для параметра touchOnBlur значение false (по умолчанию true):

const form = reduxForm({
    form: 'BoardAddModalForm',
    touchOnBlur: false
    validate
});

Документы

person gustavohenke    schedule 24.12.2016
comment
Я вижу, не могу найти этого в документации redux-form. У вас есть ссылки на то, где вы это нашли? - person Sydney Loteria; 25.12.2016
comment
Увидел это сейчас. Спасибо чувак! - person Sydney Loteria; 25.12.2016