AnswerBun.com

Usar useDispatch en una función

Stack Overflow en español Asked by ignacio garcía on December 14, 2020

En mi juego de preguntas tengo 4 opciones, y si el id de la opción que el usuario clickea, coincide con el id de la respuesta correcta, necesito actualizar la puntuación. Sin embargo, para hacerlo tengo que usar el evento onClick. Pero ahí dentro no puedo usar condicionales porque así es JSX, por lo que hice una función y simplemente es llamada dentro del evento onClick.
Este es el código:

const correctAnswer= () => {
   if(correct === index){      /* Esta condición solo checkea si es la opción correcta, no prestar atención*/
      useDispatch(incrementCounter())
   }
}
 ---------------------------------------------------------
return(
   <button onClick={correctAnswer}>example</button>    
)

Sin embargo, este código me da el siguiente error:

React Hook "useDispatch" is called in function "correctAnswer" which is neither a React function component or a custom React Hook function

La única solución que le encuentro es llamar al estado del reducer correspondiente en el componente donde el componente de opción es renderizado, sin embargo, esto le quita sentido al uso de redux ya que lo quiero aplicar para no tener que pasar tantos props por componente.

Desde ya muchas gracias!

One Answer

Para utilizar cualquier hook de react, en este caso el hook "useDispatch" primero debes inicializar el hook dentro del componente de react y no dentro de sus funciones. Puedes probar modificando tu código de la siguiente manera:

const MyComponent = () => {
  const dispatch = useDispatch(); //Nivel correcto para inicializar un hook
  ...
  const correctAnswer = () => {
    // Nivel incorrecto para inicializar un hook
    if (correct === index) {
      /* Esta condición solo checkea si es la opción correcta, no prestar atención*/
      dispatch(incrementCounter());
    }
  };
  ...
};

Te comparto la siguiente liga con mas información: reactjs.org

Correct answer by Jesús Ochoa on December 14, 2020

Add your own answers!

Related Questions

Duda sobre form e input

1  Asked on December 30, 2021

     

.htacess no funciona en servidor linux

1  Asked on December 30, 2021

         

Acceder a memoria SD con react native

1  Asked on December 28, 2021 by edwin-v

   

Obtener valores de un TableLayout

1  Asked on December 28, 2021 by jesus-alejandro-nuez-jaimez

     

Acceder al HttpContext.Session en ASP.NET Core

1  Asked on December 28, 2021 by duvan

     

Could not send request Postman

1  Asked on December 28, 2021 by agustin-coronel

 

org.hibernate.QueryException: could not resolve property

1  Asked on December 28, 2021 by dani-cantely

   

curl php comparar resultado

1  Asked on December 28, 2021

 

Leer un .txt con Genexus y obtener datos

0  Asked on December 28, 2021 by federico-moontero

   

Optimizar y crear bucle sql

1  Asked on December 27, 2021 by nacherasg

     

Hacer un registro único en base de datos usando while en Python

2  Asked on December 25, 2021 by rosendo-zarate

 

Error al recargar fragment

2  Asked on December 25, 2021 by esteban-sasso

     

Javascript – Formatear un número en string local a number

3  Asked on December 25, 2021 by leonardo-cavani

 

Crear sub menu con js

1  Asked on December 25, 2021

   

Ask a Question

Get help from others!

© 2022 AnswerBun.com. All rights reserved. Sites we Love: PCI Database, MenuIva, UKBizDB, Menu Kuliner, Sharing RPP