Recientemente realicé algunas pruebas API para un nuevo trabajo. Solo recibir datos y pasarlos. Aunque he completado las tareas y funciona funcionalmente, las personas con las que lo analizo no son grandes admiradores de componentDidMount.
¿No sugieren una alternativa? ¿Alguien sabe por qué puede ser esto? ¿Se debe a que es asíncrono?
La nueva forma moderna de hacerlo es: useEffect
Primero algo de código (de los documentos):
// Similar to componentDidMount and componentDidUpdate: useEffect(() => { // Update the document title using the browser API document.title = `You clicked ${count} times`; });Al final del día, el propósito del componenteDidMount es ejecutar algo (el efecto secundario) porque el componente fue montado (la razón o el evento).
Entonces puede especificar una matriz de dependencias (o causas) para volver a ejecutar de esta manera:
useEffect(() => { // .... }, [someVar]); así que si someVar cambió, la función se volverá a ejecutar.
Los casos de uso especiales son; omitir este argumento hará que se ejecute una vez, en el evento de montaje. y especificar una matriz vacía hará que se ejecute en cada nueva representación.
componentWillUnmount :Simplemente devuelva una función de la función interna de esta manera:
useEffect(() => { function handleStatusChange(status) { setIsOnline(status.isOnline); } ChatAPI.subscribeToFriendStatus(props.friend.id, handleStatusChange); // Specify how to clean up after this effect: return function cleanup() { ChatAPI.unsubscribeFromFriendStatus(props.friend.id, handleStatusChange); }; });