Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

204
Vistas
snackbar, nuevo temporizador cada vez que se muestra en React

Tengo un botón para agregar un artículo a una lista de deseos, por lo que cuando el usuario hace clic en ese botón, se activa un proceso de mostrar y ocultar una barra de refrigerios, que le dice al usuario que el artículo se guardó correctamente. Tengo un componente llamado AlertWishlist, y desde el padre configuré un accesorio llamado closeWishlistNotification, que básicamente ejecuta una función de tiempo de espera para esperar 5 segundos y luego cerrar la barra de bocadillos.

El snackbar en sí se basa en una variable de estado llamada isOpen, un booleano que define si mostrar u ocultar el snackbar (si es verdadero, mostrar, si es falso, ocultar).

Sin embargo, se puede volver a hacer clic en el botón para eliminar el artículo de la lista de deseos, y esta acción activa básicamente el mismo proceso que mencioné antes, la única diferencia es el mensaje que muestra la barra de refrigerios, que ahora dice "El artículo ha sido eliminado de la lista de deseos". todo esto, terminé teniendo este comportamiento:

  • El usuario hace clic en el botón, el artículo ahora se guarda en la lista de deseos.
  • isOpen = verdadero, muestra la barra de refrigerios para notificar el elemento agregado y comienza el tiempo de espera (5 segundos).
  • EN ESTE MOMENTO, EL TIEMPO DE ESPERA YA ES DE 2 SEGUNDOS: el usuario vuelve a hacer clic en el botón, el artículo ahora se elimina de la lista de deseos.
  • isOpen sigue siendo verdadero, muestra la barra de refrigerios para notificar que se eliminó el elemento y comienza el tiempo de espera (5 segundos);
  • EN ESTE MOMENTO SE HA COMPLETADO EL PRIMER TIEMPO DE ESPERA, cambie la variable isOpen a false (porque necesitamos cerrar snackbar)
  • isOpen = false, EN ESTE MOMENTO, EL SEGUNDO TIEMPO DE ESPERA YA SON 2 SEGUNDOS, pero como isOpen es false, OCULTAR SNACKBAR.

Lo que realmente quiero es que el snackbar espere 5 segundos siempre, y si cambia, por ejemplo, si se muestra el snackbar "Artículo ha sido agregado" y antes de 5 segundos el snackbar "Artículo ha sido eliminado" reemplace el primero, entonces iniciar la cuenta del tiempo de nuevo.

No estoy seguro si esta pregunta se ha respondido antes, ya que no sé cómo preguntar correctamente si reduzco esto a una reacción pura, así que decidí usar el problema que tengo como ejemplo y proporcionar la mayor cantidad de detalles posibles.

Cualquier ayuda es apreciada, gracias.

ingrese la descripción de la imagen aquí

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda