reactjs - Formik 接触了 react-day-picker

Question

我已经DayPickerInput在我的 Formik 表格中进行了设置。

<DayPickerInput
   id="hire_date"
   name="hire_date"
   formatDate={formatDate}
   parseDate={parseDate}
   format="DD/MM/YYYY"
   onDayChange={date => setFieldValue('hire_date', date)}
   onChange={handleChange}
   onBlur={handleBlur}
   value={values.hire_date}
   placeholder={`${formatDate(new Date(), "DD/MM/YYYY")}`}
   inputProps={{ 
      style: { width: "100%", padding: "0.75rem", border: "1px solid #e2e8f0", borderRadius: "0.25rem" } 
   }}
 />
 <Error touched={touched.hire_date} message={errors.hire_date} />

当我在未选择日期的情况下单击进出该字段时，我不再显示错误。

我如何接触到使用 DayPickerInput 字段？

Answer 1

react-day-picker 不支持onChange，onBlur但是您可以做的是通过将自定义输入传递给这样的方式来覆盖输入组件DayPickerInput：

<Field name="date">
              {({ field, form }) => (
                <DayPickerInput
                  name={field.name}
                  component={props => (
                      <input
                        {...field}
                        onClick={props.onClick}
                        placeholder={props.placeholder}
                      />
                  )}
 </Field>