¿De verdad necesitas useEffect para eso?

[@LatteAndCode]

💛 Los amigos de Garaje de ideas patrocinan Latte and Code y buscan talento: bit.ly/garaje-tech-talento

[@MrPocojoy]

Nunca se me había ocurrido usar así los key!! Un vídeo genial 🎉

[@LatteAndCode]

Gracias!!!!!

[@bairesjs]

Muy Buenoooo!!!!, saludos desde Argentina!

[@LatteAndCode]

Gracias! Saludos!

[@osmarmontes]

Por fin el algoritmo de KZbin funciona, contenido del bueno y suscrito

[@LatteAndCode]

Bienvenido!!!!

[@justANovaLoom]

Que buen video por diosss

[@LatteAndCode]

Gracias!!!

[@faviomagallanes]

Gracias por compartir

[@LatteAndCode]

De nada!!

[@yojose1981]

Muy interesantes estos trucos. COn respecto al segundo, si se usa la funcion cleanup para controlar ignore, se podria tambien usar para abortat la peticion a la API? Normalmente uso esta funcion para limpiar el componete cuando se desmonta, pero en este ejemplo no se si valdria. Un saludo, estupendo video.

[@sentadoensilla]

Una explicacion sencilla y contundente

[@LatteAndCode]

Muchas gracias!!!

[@ezravazquez3795]

Holaa!! super genial tus explicaciones!!!! De verdad muchas gracias, en el tercer tip, ese si me causa confución.. Porque al inicializarse el userIdState del hijo se le pasa la variable que viene por prop, entonces siento que userIdProp y userIdState siempre son iguales porque ya se inicializa el estado con la prop que recibe, pero es como si el estado de userIdState estuviera un paso atrás, no sé cómo explicarlo, pero ya he tenido errores sobre esto jeje. Lo que si no sabía era lo de la key, está super, yo la implementaba en Vue, no sabía que también se podía en react más que en las listas por map, muchas gracias nuevamente!!!

[@Jotazooo]

Me has aparecido de la nada, y sinceramente, genial. Tienes una muy buena comunicación y me han encantado los tips, entre eso y el pelazo que tienes cabron! (Yo es que estoy casi calvo... xD). Un suscriptor mas, muchas gracias!

[@LatteAndCode]

Jajaja muchas gracias y bienvenido al canal!!!

[@juniorsanchez3025]

Saludos, la tercera opción me gusta pero yo acostumbro a usar useref 😅

[@jhon.bianchi]

Maravilloso 😊

[@LatteAndCode]

🙌🏼

[@ariel18012]

Muy buena la explicación, quise investigar con una código de un reloj y la verdad que se renderiza el componente cada segundo import { useEffect, useState } from "react"; export default function Prueba() { const dataTime = new Date(); const [data, setData] = useState({ h: dataTime.getHours(), m: dataTime.getMinutes(), s: dataTime.getSeconds(), }); useEffect(() => { const timer = setInterval(() => { const dataTime = new Date(); setData({ h: dataTime.getHours(), m: dataTime.getMinutes(), s: dataTime.getSeconds(), }); }, 1000); return () => clearInterval(timer); }, []); console.log("me renderice"); return ( {data.h + " Hora " + data.m + " min " + data.s + " seg "} ); } No logre evitar que se renderize como lo explicas, se puede o estoy equivocado.

[@javierrodriguez3347]

Que crack

[@LatteAndCode]

Gracias!!!

[@TaigMacCarthy]

Muy bueno 👌

[@LatteAndCode]

Gracias!!! 😍

[@tornillogt]

Para el tip numero 2. React establece un delay por defecto para evitar que se haga una llamada por cada click? Y si es así como lo puedo cambiar?

[@alejandrolimia5644]

Buenas! Gracias por el video! Pregunta, en el tip 2 (el del ignore) no hubiese sido mejor también agregar la llamada al ignore? Porque de la manera en la que quedó la llamada se hace igual, lo que no se hace es el rerender, no?

[@LatteAndCode]

¡Gracias!! En este caso sí interesaría hacer la llamada para poder quedarnos con el resultado en el caso de que el usuario no pagine súper rápido

[@megasx6335]

@@LatteAndCode al parecer la mejor manera de hacer lo que Alejandro dice es solo deshabilitar los botones cuando se esta haciendo la llamada

[@mytvhome7394]

El último caso no lo conocia. Donde esta en la documentación?

[@LatteAndCode]

Aparece al final!

[@albertofernandezreyes949]

Me da la sensation que el ultimo método empleado realiza varios re-renders. Cuando cambiamos el userId comienza un nuevo render con el nuevo userId. Se realiza la comparación de userId y prevUserId. userId y prevUserId no tienen el mismo valor. Esto da lugar a llamar a una función set. Esta función se pone en la cola de actualizaciones para el proximo render. El programa sigue ejecutándose. Una vez a terminado con este render, ve que la cola de actualizaciones posee una actualización y comienza otro nuevo render. En este nuevo render, no se actualiza mas prevUserId y dado que no hay ninguna función en la cola de actualizaciones, termina y actualiza el DOM. Por tanto, el ultimo método me parece que hace dos renders. Es esto como funciona o me he perdido algo ?

[@nihil_um]

¿Te importaría dejar el enlace de los ejemplos que pones en codesandbox para trastear con ellos? (lo sé... soy un poco vago pero ya que están hecho, los reutilizo 😂) Un saludo y gracias por la información, por supuesto.

[@LatteAndCode]

Hola Nihil, Argggg los hice en un CodeSandbox que he perdido.... perdón!!! Pero los ejemplos están extraídos de aquí: 🔗 react.dev/learn/you-might-not-need-an-effect

[@nihil_um]

@@LatteAndCode Nada, no hay problema. Montaré algo rápido y listo.

[@nihil_um]

@@LatteAndCode Por cierto, ya decía yo que el primer ejemplo del video me sonaba bastante (el del cambio de usuario) y es que ya tuviste ese problema antes y lo resolviste en aquella ocasión con el useEffect. Si hubieses dado con esta información antes...

[@kevinrivas802]

Me quedo con key, menos codigo, esto no lo recomiendo porque un error y se va el bucle al cielo ajjajaj

[@LatteAndCode]

Sí, el truco de setState con cuidado!