Actualmente estoy reescribiendo mi sitio web en una aplicación web con ReactJS, y tengo algunos problemas para usar y comprender los ganchos. Escribí un gancho personalizado "useFetch" que funciona, nunca tuve ningún problema hasta ahora: actualmente estoy tratando de usar mi gancho en una función como esta:

 import useFetch from '../../../hooks/useFetch'; import {clientGenerateProcessScreen, clientClearProcessScreen} from '../../../utils/processScreens'; function myFunction (paramName, paramType, paramDesc) { let process_screen = clientGenerateProcessScreen (); let rqt_url = `/fileNameA.php`; if (paramType!= "a") rqt_url = `/fileNameB.php`; const { data, isLoading, error } = useFetch(rqt_url); if (!isLoading && data.success) { doSomethingA (); } else { showErrorMessage (); } } export default myFunction;

La función se llama desde un onClick en un componente de reacción. Teóricamente debería funcionar bien, sin embargo, siempre termino teniendo este error:

Error no detectado: Llamada de gancho no válida. Los ganchos solo se pueden llamar dentro del cuerpo de un componente de función. Esto podría suceder por una de las siguientes razones:

1. Es posible que tenga versiones que no coincidan de React y el renderizador (como React DOM)
2. Podrías estar rompiendo las Reglas de los Hooks
3. Es posible que tenga más de una copia de React en la misma aplicación

No entiendo dónde está el error aquí. Estoy usando mi gancho en la parte superior de una función, no en una condición ni nada que pueda romper las reglas del gancho. He intentado importar React y ReactDOM en mi archivo de funciones, pero esto no resuelve ninguno de mis problemas. Supongo que podría haberme perdido algo básico o simple, pero no puedo encontrar qué...