crootfast/template/apps/react18/src/common/hooks/useFastHook.js

大前端工程化命令行脚手架

import { useEffect, useRef } from "react";
import { createDeepProxy } from "../utils/tools";

const funcCache = new Map();

// useWatch 钩子
export function useWatch(obj = {}, callback = () => {}) {
  useEffect(() => {
    const proxyData = createDeepProxy(obj, () => {
      typeof callback === "function" && callback();
    });
    Object.assign(obj, proxyData);
  }, [JSON.stringify(obj)]);
}

export function useWillMount(func, key) {
  const resetRef = useRef(null);

  if (!funcCache.has(key)) {
    funcCache.set(key, func);
    resetRef.current = func ? func() : null;
  }

  useEffect(() => {
    return () => {
      funcCache.delete(key);

      if (resetRef.current) {
        resetRef.current();
      }
    };
    // 空依赖数组确保这个 effect 只在组件挂载和卸载时运行
  }, []);
}