Estoy intentando devolver un componente HOC desde dentro del gancho.
Digamos que tengo un componente de nivel superior como...
function Component(props){ //do something with props; return <h1>Hello {props.title}</h1> }Y un gancho que conoce algunos accesorios y quiere liberar al usuario de proporcionar esos accesorios.
function useHook(){ //somehow get prop values at runtime(say title) const title = //get from API call; return (props) => <Component title={title} {...props}/> }¿Alguna idea de por qué ocurre aquí una reproducción infinita? ¿Debería usar useCallback?
React Hooks devuelve el componente de envoltura de niños
El problema fue abordado aquí. useCallback resolvió la repetición infinita. Parece que el gancho estaba recreando el componente en cada ejecución (la referencia de función cambia en cada ejecución, aunque parece que es la misma función).
function useHook(){ //somehow get prop values at runtime(say title) const title = //get from API call; return useCallback((props) => <Component title={title} {...props}/>,[title]); }