Title: Limpiar funcion al desmontar el componente en el useEffect de React
Tags: reactjs
Question: tengo un proyecto en React Hecho con React hooks, en el que al cargar el componente hero de un pagina llama a una función que tiene una animación con js.
Esta función tiene un set interval. Cuando hago click a otra página antes de que acabe el interval (se sigue ejecturando) y falla la página porque claro no es la pagina home y no encuentra varios elementos id.
Como puedo desuscribirme o limpiar la funcion al desmontar el componente con react hooks?
os dejo el use effect que tengo ahora pero que no funciona, no lo limpia.
useEffect(() =&gt; {
Animations.hero()
return () =&gt; Animations.hero();
}, [component,])
Comment: Te suscribes con: `Animations.hero()`, y tambien te desuscribes con: `Animations.hero()`, la logica seria que para desuscribirte tengas una funcion diferente a `hero()`

Here is the accepted answer: Tal cual comenta Shassain debes tener un método que te permita suscribirte y otro que te permita desuscribirse para que todo el ciclo funcione de forma correcta tal cual lo explican en la documentación oficial de ReactJS
Enlace oficial: https://es.reactjs.org/docs/hooks-overview.html
Algo así como esto:
import React, { useEffect } from "react";
class Animation {
constructor() {
this.count = 0;
this.animation = null;
start() {
this.animation = setInterval(() =&gt; {
this.count++;
console.log("animation hero", this.count);
}, 1000);
stop() {
clearInterval(this.animation);
export default function App() {
useEffect(() =&gt; {
const animation = new Animation();
animation.start();
return () =&gt; animation.stop();
}, []);
return (
<div className="App"&gt;
<h1&gt;Hello Hero</h1&gt;
</div&gt;


{'source': 'StackExchangeDataset', 'subset': 'es.stackoverflow.com', 'metadata': {'AnswerCount': 1, 'CommentCount': 1, 'ContentLicense': 'CC BY-SA 4.0', 'CreationDate': '2020:00:03/01/20', 'FavoriteCount': None, 'PostTypeId': 1, 'Tags': '<reactjs>', 'Title': 'Limpiar funcion al desmontar el componente en el useEffect de React', 'ViewCount': 2784, 'id': 333526, 'user_AboutMe': None, 'user_AccountId': 14050032.0, 'user_DisplayName': 'Juanperez', 'user_Reputation': 440.0, 'user_Views': 17.0, 'user_id': 95337.0}}