Intentaré explicar mi problema, he creado un contenedor de API de contexto personalizado para todos mis datos. Ahora, tengo este docType que no siempre está definido ni existe.

Cuando lo desstructuro así:

 const { docType } children?.props?.data; // My Next App / JS crashes and getting the undefined error.

Hacer esto funciona:

 const docType = children.props.data?.docType;

No estoy muy seguro de por qué sucede esto. la desestructuración de todos los demás accesorios de datos fallará si no escribo mi código así:

 import { createContext, useContext } from "react"; const AppContext = createContext(); export const AppWrapper = ({ children }) => { const docType = children.props.data?.docType; const site = children.props.data?.site; const page = children.props.data?.page; const preview = children.props?.preview; const sharedState = { docType, preview, page, site, }; return ( <AppContext.Provider value={sharedState}>{children}</AppContext.Provider> ); }; export const useAppContext = () => useContext(AppContext);

¿Alguien puede explicarme por qué tengo este problema?