El valor de entrada de la campaignid del formulario se completa automáticamente cuando se carga la página. Cuando hago clic en los otros campos, se restablece a los valores predeterminados.

¿Qué puedo hacer para evitar el incumplimiento y preservar el valor de entrada de mi ID de campaignid ?

Estoy usando una secuencia de comandos de terceros para obtener parámetros de URL e insertarlos en el valor de ID de campaignid .

 import { Button, FormControl, Input } from "@chakra-ui/react"; import { Field, Form, Formik } from "formik"; import Script from "next/script"; export default function FormikExample() { return ( <> <Script src="https://cdn.jsdelivr.net/gh/gkogan/sup-save-url-parameters/sup.min.js" /> <Formik initialValues={{ name: "", }} onSubmit={(values) => { setTimeout(() => { fetch(`https://hooks.zapier.com/hooks/catch/3660927/bte5w77/`, { method: "POST", body: JSON.stringify(values, null, 2), }), 3000; }); }} > {(props) => ( <Form id="hero"> <Field name="name"> <FormControl> {({ field }) => <Input {...field} type="text" id="name" />} </FormControl> </Field> <Field name="email"> <FormControl> {({ field }) => <Input {...field} type="email" id="email" />} </FormControl> </Field> <Field name="campaignid"> {({ field }) => ( <FormControl isReadOnly> <Input {...field} type="hidden" value="" id="campaignid" /> </FormControl> )} </Field> <Button id="submited" isLoading={props.isSubmitting} type="submit"> Submit </Button> </Form> )} </Formik> </> ); }