Quiero llamar a una función useFetch en mi proyecto. Tengo que obtener 3 parámetros para ejecutar esta API. Creé una función para eso pero hay un error:
Error: llamada de enlace 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:
26 | export default function ProductTypeList() { 27 | async function ConfirmFunction(credit, userID, operation) { > 28 | return useFetch( 29 | "/credit/add?userId=" +
¿Cómo puedo arreglarlo?
export default function ProductTypeList() { async function ConfirmFunction(credit, userID, operation) { return useFetch( "/credit/add?userId=" + userID + "&amount=" + credit + "&type=" + operation ); } ... return <Button color="primary" onClick={() => ConfirmFunction(selectedAmount, select, selectOperation) } > Okay </Button>Nota: Todos los parámetros son verdaderos.
Es la primera regla de usar ganchos de reacción.
Solo ganchos de llamada en el nivel superior
https://reactjs.org/docs/hooks-rules.html
Debe mover eso al nivel superior de su componente. Si necesita usar el valor de estado addCredit , puede pasarlo como un argumento o si la función está definida dentro del componente, puede usarla en el alcance, por ejemplo.
const MyComponent = () => { const [addCredit, setAddCredit] = useState(); async function ConfirmFunction(credit, userID, operation) { return whateverFetchClient.fetch( "/credit/add?userId=" + userID + "&amount=" + credit + "&type=" + operation ); } }