Buen día, actualmente estoy trabajando en una aplicación firestore/react. Y tengo este formulario donde configuro los valores iniciales usando sintaxis/operador extendido. Todo funciona bien, pero cuando intento almacenar un valor de fecha, Firestore lo convierte en una marca de tiempo. Bloquea mi aplicación porque no sabe cómo leerla.

Mi método antes era hacerlo manualmente. (Establecer los valores iniciales y luego convertir la marca de tiempo). Pero a medida que los requisitos de forma se vuelven complejos y necesitan mucha fecha. Se me hace más difícil hacerlo.

 const [targetClient, setTargetClient] = useState([]); const Data = () => { const usersCollectionRef = collection(db, "client"); onSnapshot(usersCollectionRef, (snapshot) => { let userData = [] snapshot.docs.forEach(doc => { userData.push({ ...doc.data(), id: doc.id }) }) setTargetClient(userData) }) }; useEffect(() => { Data(); }, []);

Luego lo pasé a través de componentes usando

 <ViewClient works={works} />

Así es como acabo de establecer los valores iniciales.

 const initialValues = { ...works }

Funciona, pero cuando se trata de fechas, simplemente falla/error, ya que recibiría una marca de tiempo.

Así es como suelo hacerlo manualmente.

 const conf = data5.works.Figure4.conforme.date.seconds const newconf = new Date(conf*1000) const initialValues = { name:props.name age:props.age date1:conf }

¿Alguien puede darme una idea/guía sobre cómo proceder?

Olvidé agregar que estoy usando un componente de fecha personalizado.

 export default function DatePicker(props) { const { label, name } = props return ( <> <FormLabel>{label}</FormLabel> <Field name={name} > { ({ form, field }) => { const { setFieldValue } = form const { value } = field return ( <DateView className="chakra-input css-1c6j008" id={name} {...field} selected={value} onChange={val => setFieldValue(name, val)} // minDate={new Date()} // dateFormat='dd/MM/yyyy' isClearable peekNextMonth showMonthDropdown showYearDropdown dropdownMode="select" /> ) } } </Field> <ErrorMessaging name={name} /> </> )

}