Как использовать пользовательский ввод с Formik в React?

Question

Я пытаюсь использовать DatePicker в Formik .Но когда я нажимаю дату DatePicker, ее значение формы не изменяется.Вместо этого я получил эту ошибку:

Uncaught TypeError: e.persist не является функцией в Formik._this.handleChange (formik.es6.js: 5960)

Я сокращаю код, код ниже

const SomeComponent = () => (
    <Formik
        render={({
            values,
            handleSubmit,
            handleChange,
            setFieldValue
        }) => {
            return (
                <div>
                    <form onSubmit={handleSubmit}>
                        <DatePicker
                            name={'joinedAt'}
                            value={values['joinedAt']}
                            onChange={handleChange}
                        />
                    </form>
                </div>
            )
        }}
    />
)

Я погуглил несколько документов, https://github.com/jaredpalmer/formik/issues/187 и https://github.com/jaredpalmer/formik/issues/86

Поэтому я попытался, как показано ниже, но это не работает.

 ...setFieldValue

 <DatePicker
   name={'joinedAt'}
   value={values['joinedAt']}
   onChange={setFieldValue}
 />

Answer 1

Я разрешаю это как

<DatePicker
   name={'joinedAt'}
   value={values['joinedAt']}
   onChange={e => setFieldValue('joinedAt', e)}
 />

Answer 2

Для html примитивных полей ввода handleChange работает как шарм, но для пользовательских компонентов вы должны использовать setFieldValue для обязательного изменения значения.

onChange={e => setFieldValue('joinedAt', e)}

Answer 3

https://github.com/jaredpalmer/formik/issues/692

вам нужно установить значение вручную, если вы используете метод setFieldValue