Dynami c Formik Form Использование withFormik - PullRequest
Новая
       6

Dynami c Formik Form Использование withFormik

0 голосов
/ 20 февраля 2020

Я пытаюсь создать компонент React, который будет возвращать форму Formik, которая использует withFormik. Этот компонент будет передан другому компоненту в качестве реквизита, который возвращает содержимое формы. Это возможно? Я не могу определить, как передавать пользовательские реквизиты в mapPropsToValues ​​(в основном, как поместить что-то нестандартное вместо: 

   one:'',
   two:'',
   three:''

в приведенном ниже коде: 

const DynamicCustomForm = ({FormType, formName, formFields,  ...props}) => {

    console.log(props);

        const {
            values,
            touched,
            errors,
            status,
            handleChange,
            handleBlur,
            setFieldValue,
            setFieldTouched,
            validateField,
            validateForm,
            handleSubmit,
            isSubmitting,
        } = props;
        return (
            <form onSubmit={handleSubmit}>
                <Field name={formName} >
                    {({
                        field,
                        form,
                        meta,
                    }) => (
                        <FormType />
                    )}
                </Field>

                <Button type="submit" className="button" disabled={isSubmitting}>
                    Submit
                </Button>

            </form>

        );
    };


    const FormikEnhancedDynamicCustomForm = withFormik({
        mapPropsToValues: () => ({
            one:'',
            two:'',
            three:''
        }),
        validateOnMount: false,
        validateOnBlur: false,
        //validate: validate,
        handleSubmit: (values, { setSubmitting }) => {
            handleSubmit(values);
            setTimeout(() => {
                alert(JSON.stringify(values, null, 2));
                setSubmitting(false);
            }, 1000);
        },

        displayName: 'DynamicCustomForm',
    })(DynamicCustomForm);

    export default FormikEnhancedDynamicCustomForm;

1 Ответ

0 голосов
/ 21 февраля 2020

Эта публикация https://github.com/jaredpalmer/formik/issues/752 помогла мне определить, что если я удалю mapPropsToValues, то все, что я передам в качестве опоры для Компонента с формой Formik, будет добавлено как значения Formik. Мне все равно было бы интересно, есть ли другие способы сделать это.

...