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

Gridview jquery se pierde cuando recargo datatable

1  Asked on December 23, 2020 by ibeth-carmona

       

Android: Problemas con formato de fechas (SimpleDateFormat)

0  Asked on December 22, 2020 by verlyn-luna

   

¿crear lista de botones del mismo tamaño en flutter?

1  Asked on December 21, 2020 by harvey66

   

Herramienta de modelado de bases de datos nosql

0  Asked on December 21, 2020 by jose-ignacio-gonazlez

       

¿Qué es memoización y cómo se usa?

1  Asked on December 21, 2020 by candid-moe

     

Exportar a Excel en ASP.NET

2  Asked on December 21, 2020 by carlosr93

   

Mi aplicación WPF no se ejecuta en otros ordenadores

1  Asked on December 21, 2020 by devinthe30s

       

Json undefined problema con mostrar los valores

0  Asked on December 20, 2020 by locura

         

Como detener un bucle for sin usar un break?

2  Asked on December 20, 2020 by julin-taborda

   

Funcionalidad del return en JavaScript

3  Asked on December 19, 2020 by junner13

 

Porqué no se muestra la imagen de fondo?

0  Asked on December 19, 2020 by christian-hidalgo

   

Odoo server no se inicia en Windows 10

0  Asked on December 18, 2020

     

Ask a Question

Get help from others!

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