Question

我有一个带有大量输入的正式表单。我可以在onValidSubmit函数中看到这些输入的值。此类输入的一个示例如下：

<Input
    name="myStartDate"
    id="myStartDate"
    value=""
    label="Start Date (YYYYMM)"
    type="tel"
    validations={{
        matchRegexp: /^(19|20)\d\d(0[1-9]|1[012])$/
    }}
    validationErrors={{
        matchRegexp: 'Enter the year and month (YYYYMM).'
    }}
    placeholder="YYYYMM"
    required
/>

在正式表格中，我有：

onValidSubmit={this.onValidSubmit}

该功能仅记录表单数据：

onValidSubmit(formData){
    console.log(formData);
}

我想将此输入更改为react-datepicker组件（DatePicker），但是，在进行必要的更改以使DatePicker工作之后，onValidSubmit中的“ formData”对象不再包含“ myStartDate”的值。 ”。我应该怎么做才能使这项工作？

我的DatePicker组件如下所示：（它与Input基本上相同，但有一些其他东西）

<DatePicker
    name="myStartDate"
    id="myStartDate"
    value=""
    label="Start Date (YYYYMM)"
    type="tel"
    validations={{
        matchRegexp: /^(19|20)\d\d(0[1-9]|1[012])$/
    }}
    validationErrors={{
        matchRegexp: 'Enter the year and month (YYYYMM).'
    }}
    placeholder="YYYYMM"
    required
    placeholderText="ÅÅÅÅMM"
    dateFormat="YYYYMM"
    className="form-control"
    selected={this.state.myStartDate}
    onChange={this.myStartDate}
    isClearable={true}
/>

我知道DatePicker使用moment.js处理日期，并且我将相应地处理此更改，但是，正如我之前所说，“ myStartDate”不再显示在传递给“ onValidSubmit”的“ formData”对象中。有什么作用？

非常感谢您的帮助！

formy-react和react-datepicker无法协同工作

0 个答案: