0
229
VistasAntd con formik setFieldValue
Hay una tabla Antd con datos, cuando hago clic en el botón "Cambiar", toda la línea con datos se pasa a la función en forma de objeto, ahora queda insertar datos en los campos, pero no puedo, ¿Qué tengo que hacer?
¿Cómo configurar los datos en la entrada antd usando la función externa?
Puedo hacerlo con .map(), pero me parece mas adecuado usar formik
const BankForm = (props) => { const [form] = Form.useForm(); //show close form const columns = [ ...MY columns { title: "Действие", key: "action", fixed: "right", render: (text, record) => ( <Space size="middle" I clink to Button and all data of row go to ChangeBank(record) <a onClick={() => ChangeBank(record)}> Изменить</a> </Space> ), }, ]; const formik = useFormik({ initialValues: { name_bank: "", }, validate, onSubmit: (values) => { }, }); //my function to set data to form let ChangeBank = (record) => { formik.setFieldValue("name_bank", record.name_bank); }; return ( <div className={clas.tableBlock_header}> my form <Form form={form} layout="vertical" hideRequiredMark onFinish={formik.handleSubmit} > <Form.Item name="name_bank" label="Название банка" rules={[{ required: true, message: "Введите название банка" }]} > <Input value={formik.values.name_bank} name="name_bank" /> </Form.Item> </Form> ); };
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Si desea establecer valores en campos de formulario antd con formik, no dé el nombre Form.item
Y si desea usar antd con formik, y necesita validar sus entradas, simplemente descargue Yup . No use métodos antd. si con formik
<Form form={form} layout="vertical" hideRequiredMark onFinish={formik.handleSubmit} > <Form.Item label="Название банка" rules={[{ required: true, message: "Введите название банка" }]} > <Input value={formik.values.name_bank} name="name_bank" /> </Form.Item> </Form>**strong text**
·
Juan Pablo Isaza
Denunciar
Responde la pregunta