Lifecycle

onCleanup

编辑此页面

onCleanup 注册一个清理方法，该方法在当前响应式作用域被销毁和重新计算时执行。 可以在任何地方使用它来清理初始化留下的任何副作用。

当在组件中使用时，它会在组件卸载时运行。 当在响应式上下文中使用时，比如 createEffect、createMemo 或 createRoot，它会在响应式作用域被销毁或刷新时运行。

import { onCleanup } from "solid-js"


function onCleanup(fn: () => void): void;

如果没有 onCleanup 函数，即使组件从页面中移除后，事件监听器仍然会保持附加在 document 上。 这可能会导致内存泄漏和其他问题。

import { createSignal, onCleanup } from "solid-js"


const Component = () => {
  const [count, setCount] = createSignal(0);


  const handleClick = () => setCount((value) => value + 1);


  document.addEventListener("click", handleClick);


  /**
   * 当组件从页面中移除/卸载时移除事件监听器。
   */
  onCleanup(() => {
    document.removeEventListener("click", handleClick);
  });


  return <main>文档被点击了 {count()} 次</main>;
};
报告此页面问题