无法从Redux Form获取值

时间:2018-09-18 21:28:15

标签: javascript redux

当我在表单中输入内容时,我总是变得不确定。

export class DayForm extends React.Component {
onSubmit(values) {
    this.props.dispatch(saveDay(values));
    return this.props.history.push("/dashboard");
    };


render() {
    console.log(this.props.values);
    return(

        <form className="day-form"
        onSubmit={this.props.handleSubmit(values =>
                this.onSubmit(values)
        )}>
        <legend class="form-title">Log Meals</legend>
        <fieldset>
            <div className="general-inputs">
                <div className="field-container">
                    <label htmlFor="date">Date:</label>
                    <Field component={Input} type="date" name="date"
                    validate={[required, nonEmpty, isTrimmed]}/>
                </div>

                <div className="field-container">
                    <label htmlFor="meal1">Meal #1:</label>
                    <Field
                        component={Input}
                        type="text"
                        name="meal1"
                        validate={[required, nonEmpty, isTrimmed]} />
                </div>

                <div className="field-container">
                    <label htmlFor="meal2">Meal #2:</label>
                    <Field
                        component={Input}
                        type="text"
                        name="meal2"
                        validate={[required, nonEmpty, isTrimmed]} />
                </div>

                <div className="field-container">
                    <label htmlFor="meal3">Meal #3:</label>
                    <Field
                        component={Input}
                        type="text"
                        name="meal3"
                        validate={[required, nonEmpty, isTrimmed]} />
                </div>

                <div className="field-container">
                    <label htmlFor="snack">Snacks/Other:</label>
                    <Field
                        component={Input}
                        type="text"
                        name="snack"
                        validate={[required, nonEmpty, isTrimmed]} />
                </div>
            </div>
            <div className="submit-btn-box">
                <button
                    className="submit-btn"
                    type="submit"
                    disabled={this.props.pristine || this.props.submitting}>
                    Submit
                </button>
            </div>
        </fieldset>
        </form>
    );
}
}

export default reduxForm({
form: 'dayForm',
onSubmitFail: (errors, dispatch) => dispatch(focus('date','meal1', 'meal2', 'meal3', 'snack'))
})(DayForm);

我对使用Redux还是很陌生,所以我不知道我是否在这里缺少明显的东西。我试图做的就是在此表单上获取这几项的值,然后在单独的页面上获取这些值以显示它们。如果你们都需要看到更多类似我的动作或减速器的信息,我也可以分享。

因此,我想做的是形成一种表格,其中有人记下进餐1,进餐2,进餐3和小吃。然后在另一个页面上,我希望能够获取这些进餐值。

0 个答案:

没有答案