Блог

Я вызываю функцию socket.on внутри компонента, но я хочу остановить ее при отключении компонента, я использую функциональный компонент.

 useEffect(() => {
    socket.on("new-chat-message", (firstname, lastname, content, date) => {
      dispatch(
        addMessage({
          firstname: firstname,
          lastname: lastname,
          content: content,
          date: date,
        })
      );
    });
  }, [dispatch, socket]);
 

Мне нужно знать, как настроить функцию очистки для этого эффекта использования.

Как описано в документе здесь

 useEffect(() => {
    const callback = (firstname, lastname, content, date) => {
      dispatch(
        addMessage({
          firstname: firstname,
          lastname: lastname,
          content: content,
          date: date,
        })
      );
    }

    socket.on("new-chat-message", callback);

    return () => {
       socket.off("new-chat-message", callback);
    }
}, [dispatch, socket]);