jsx-eslint/eslint-plugin-react

Feature request: abortController + no-leaked-event-listener

Open

#3,967 建立於 2025年11月21日

在 GitHub 查看
 (3 留言) (0 反應) (0 負責人)JavaScript (2,797 fork)batch import
bughelp wanted

倉庫指標

Star
 (8,630 star)
PR 合併指標
 (30 天內沒有已合併 PR)

描述

i've been using this pattern to clean up event listeners lately:

useEffect(() => {
  const abortController = new AbortController();
  const { signal } = abortController;

  window.addEventListener(
    "click",
    (event) => {
      doSomething();
    },
    { signal },
  );

  window.addEventListener(
    "resize",
    (event) => {
      doSomethingElse();
    },
    { signal },
  );

  return () => {
    abortController.abort();
  };
}, []);

it makes the cleanup function much smaller (and harder to mess up), plus it helps with type inference (i.e. you don't need to explicitly type your event handlers).

i can obviously just disable the no-leaked-event-listener rule, but it would be nice if it could detect this pattern with a heuristic, and maybe even alert you e.g. if you forget to pass signal or forget to call abort().

貢獻者指南