@hsu-react/ui 2.5.4 → 2.5.5

package/src/components/Chart/callbacks.test.tsx

@@ -0,0 +1,315 @@
+import React, { useState } from "react";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { act, render } from "@testing-library/react";
+
+/**
+ * 这一组用例盯的是同一条缺陷：**回调 prop 进 effect 依赖数组**。
+ *
+ * 消费方写内联箭头（`onXxx={(v) => setV(v)}`）时每次渲染都是新引用，
+ * 回调进依赖数组 → effect 重跑 → 重新 setOption / 重新注册监听 / 再发一次通知，
+ * 通知里再 setState 就是死循环。
+ *
+ * 但这些回调同时还被当作「要不要注册这个监听」的真值判断，
+ * 所以修法不能是「把回调从依赖数组里删掉」了事——
+ * 「从无到有传入回调」必须仍然能正确注册，这里每个组件都单独验一条。
+ */
+
+type Handler = (params: unknown) => void;
+
+const chart = {
+  setOption: vi.fn(),
+  resize: vi.fn(),
+  dispose: vi.fn(),
+  getDataURL: vi.fn(() => "data:image/png;base64,AAAA"),
+  getOption: vi.fn(() => ({ dataZoom: [{ start: 0, end: 100 }] })),
+  on: vi.fn(),
+  off: vi.fn(),
+};
+const handlers = new Map<string, Set<Handler>>();
+
+chart.on.mockImplementation(((event: string, handler: Handler) => {
+  if (!handlers.has(event)) handlers.set(event, new Set());
+  handlers.get(event)!.add(handler);
+}) as never);
+chart.off.mockImplementation(((event: string, handler?: Handler) => {
+  if (!handler) handlers.delete(event);
+  else handlers.get(event)?.delete(handler);
+}) as never);
+
+const emit = (event: string, params?: unknown) => {
+  act(() => {
+    handlers.get(event)?.forEach((h) => h(params));
+  });
+};
+const listenerCount = (event: string) => handlers.get(event)?.size ?? 0;
+
+vi.mock("echarts", () => ({
+  init: () => chart,
+  use: () => {},
+  registerTheme: () => {},
+  graphic: {},
+}));
+vi.mock("echarts-gl", () => ({}));
+
+import ChartBar from "./Bar";
+import ChartLine from "./Line";
+import ChartSankey from "./Sankey";
+import ChartTree from "./Tree";
+import ChartPie from "./Pie";
+
+// 容器必须量得到尺寸，否则 useContainerReady 不放行 echarts.init
+beforeEach(() => {
+  handlers.clear();
+  vi.clearAllMocks();
+  chart.getOption.mockImplementation(() => ({
+    dataZoom: [{ start: 0, end: 100 }],
+  }));
+  vi.spyOn(Element.prototype, "getBoundingClientRect").mockReturnValue({
+    width: 600,
+    height: 400,
+    top: 0,
+    left: 0,
+    right: 600,
+    bottom: 400,
+    x: 0,
+    y: 0,
+    toJSON: () => ({}),
+  } as DOMRect);
+});
+
+const X_AXIS = ["一", "二", "三", "四"];
+const SERIES = [{ name: "A", value: [1, 2, 3, 4] }];
+const SANKEY_NODES = [{ name: "a" }, { name: "b" }];
+const SANKEY_LINKS = [{ source: "a", target: "b" }];
+const TREE_DATA = [{ name: "root", value: 1, children: [] }];
+const PIE_DATA = [{ name: "a", value: 1 }];
+
+describe("Chart.Bar / Chart.Line 的回调 prop", () => {
+  const cases = [
+    ["Chart.Bar", ChartBar],
+    ["Chart.Line", ChartLine],
+  ] as const;
+
+  for (const [name, Comp] of cases) {
+    describe(name, () => {
+      it("内联 onDataZoomWindowChanged 写回 state 不会死循环，窗口没变也不重复通知", () => {
+        const spy = vi.fn();
+
+        function Consumer() {
+          const [, setWin] = useState<unknown>(null);
+
+          return (
+            <Comp
+              xAxisData={X_AXIS}
+              seriesData={SERIES}
+              // 内联箭头：每次渲染都是新引用
+              onDataZoomWindowChanged={(w) => {
+                spy(w);
+                setWin(w);
+              }}
+            />
+          );
+        }
+
+        render(<Consumer />);
+
+        // 初次同步一次窗口；进了循环这里会是几十上百次
+        expect(spy).toHaveBeenCalledTimes(1);
+        expect(spy).toHaveBeenCalledWith({ startIndex: 0, endIndex: 3 });
+      });
+
+      it("onClick 换引用不重复注册监听，且调到的是最新的那个", () => {
+        const first = vi.fn();
+        const second = vi.fn();
+
+        const { rerender } = render(
+          <Comp xAxisData={X_AXIS} seriesData={SERIES} onClick={first} />,
+        );
+        expect(listenerCount("click")).toBe(1);
+
+        rerender(
+          <Comp xAxisData={X_AXIS} seriesData={SERIES} onClick={second} />,
+        );
+        // 换引用不该拆装监听，更不该重新 setOption
+        expect(listenerCount("click")).toBe(1);
+
+        emit("click", { name: "x" });
+        expect(first).not.toHaveBeenCalled();
+        expect(second).toHaveBeenCalledTimes(1);
+      });
+
+      it("onLegendSelectChanged 从无到有传入时仍会注册", () => {
+        const { rerender } = render(
+          <Comp xAxisData={X_AXIS} seriesData={SERIES} />,
+        );
+        // 没传就不注册
+        expect(listenerCount("legendselectchanged")).toBe(0);
+
+        const spy = vi.fn();
+        rerender(
+          <Comp
+            xAxisData={X_AXIS}
+            seriesData={SERIES}
+            onLegendSelectChanged={spy}
+          />,
+        );
+        expect(listenerCount("legendselectchanged")).toBe(1);
+
+        emit("legendselectchanged", { selected: { A: false } });
+        expect(spy).toHaveBeenCalledWith({ A: false });
+      });
+
+      it("onDataZoomWindowChanged 从无到有传入时仍会注册并同步一次窗口", () => {
+        const { rerender } = render(
+          <Comp xAxisData={X_AXIS} seriesData={SERIES} />,
+        );
+        expect(listenerCount("datazoom")).toBe(0);
+
+        const spy = vi.fn();
+        rerender(
+          <Comp
+            xAxisData={X_AXIS}
+            seriesData={SERIES}
+            onDataZoomWindowChanged={spy}
+          />,
+        );
+        expect(listenerCount("datazoom")).toBe(1);
+        expect(spy).toHaveBeenCalledWith({ startIndex: 0, endIndex: 3 });
+
+        spy.mockClear();
+        emit("datazoom", { start: 25, end: 100 });
+        expect(spy).toHaveBeenCalledWith({ startIndex: 1, endIndex: 3 });
+      });
+
+      it("传回调后又撤掉时监听会摘干净", () => {
+        const { rerender } = render(
+          <Comp
+            xAxisData={X_AXIS}
+            seriesData={SERIES}
+            onLegendSelectChanged={() => {}}
+          />,
+        );
+        expect(listenerCount("legendselectchanged")).toBe(1);
+
+        rerender(<Comp xAxisData={X_AXIS} seriesData={SERIES} />);
+        expect(listenerCount("legendselectchanged")).toBe(0);
+      });
+    });
+  }
+});
+
+describe("Chart.Sankey / Chart.Tree 的 getImage", () => {
+  it("Sankey：getImage 换引用不重新 setOption，出图时调到的是最新的那个", () => {
+    const first = vi.fn();
+    const second = vi.fn();
+
+    const { rerender } = render(
+      <ChartSankey
+        seriesData={SANKEY_NODES}
+        seriesLinks={SANKEY_LINKS}
+        getImage={first}
+      />,
+    );
+    const before = chart.setOption.mock.calls.length;
+
+    rerender(
+      <ChartSankey
+        seriesData={SANKEY_NODES}
+        seriesLinks={SANKEY_LINKS}
+        getImage={second}
+      />,
+    );
+    // 出图回调不是画图的输入，换引用不该让图重画
+    expect(chart.setOption.mock.calls.length).toBe(before);
+
+    emit("finished");
+    expect(first).not.toHaveBeenCalled();
+    expect(second).toHaveBeenCalledTimes(1);
+  });
+
+  it("Sankey：内联 getImage 把图存进 state 不会死循环", () => {
+    const spy = vi.fn();
+
+    function Consumer() {
+      const [, setImg] = useState("");
+
+      return (
+        <ChartSankey
+          seriesData={SANKEY_NODES}
+          seriesLinks={SANKEY_LINKS}
+          getImage={(img) => {
+            spy(img);
+            setImg(img);
+          }}
+        />
+      );
+    }
+
+    render(<Consumer />);
+    emit("finished");
+    emit("finished");
+
+    // finished 触发几次就回调几次，不会自激放大
+    expect(spy).toHaveBeenCalledTimes(2);
+  });
+
+  it("Tree：getImage 换引用不重新 setOption，出图时调到的是最新的那个", () => {
+    const first = vi.fn();
+    const second = vi.fn();
+
+    const { rerender } = render(
+      <ChartTree seriesData={TREE_DATA} getImage={first} />,
+    );
+    const before = chart.setOption.mock.calls.length;
+
+    rerender(<ChartTree seriesData={TREE_DATA} getImage={second} />);
+    expect(chart.setOption.mock.calls.length).toBe(before);
+
+    emit("finished");
+    expect(first).not.toHaveBeenCalled();
+    expect(second).toHaveBeenCalledTimes(1);
+  });
+
+  it("Tree：从无到有传入 getImage 时仍能拿到图", () => {
+    const spy = vi.fn();
+    const { rerender } = render(<ChartTree seriesData={TREE_DATA} />);
+
+    emit("finished");
+    expect(spy).not.toHaveBeenCalled();
+
+    rerender(<ChartTree seriesData={TREE_DATA} getImage={spy} />);
+    emit("finished");
+    expect(spy).toHaveBeenCalledTimes(1);
+  });
+});
+
+describe("Chart.Pie 的 onClick", () => {
+  it("换引用不重复注册，且调到最新引用", () => {
+    const first = vi.fn();
+    const second = vi.fn();
+
+    const { rerender } = render(
+      <ChartPie seriesData={PIE_DATA} onClick={first} />,
+    );
+    expect(listenerCount("click")).toBe(1);
+
+    rerender(<ChartPie seriesData={PIE_DATA} onClick={second} />);
+    expect(listenerCount("click")).toBe(1);
+
+    emit("click", { name: "a" });
+    expect(first).not.toHaveBeenCalled();
+    expect(second).toHaveBeenCalledTimes(1);
+  });
+
+  it("从无到有传入 onClick 时仍会注册", () => {
+    const spy = vi.fn();
+    const { rerender } = render(<ChartPie seriesData={PIE_DATA} />);
+    expect(listenerCount("click")).toBe(0);
+
+    rerender(<ChartPie seriesData={PIE_DATA} onClick={spy} />);
+    expect(listenerCount("click")).toBe(1);
+
+    emit("click", { name: "a" });
+    expect(spy).toHaveBeenCalledTimes(1);
+  });
+});

package/src/components/Select/_hooks/useSelectComposition.test.ts

@@ -0,0 +1,47 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { renderHook } from "@testing-library/react";
+
+import { useSelectComposition } from "./useSelectComposition";
+
+/**
+ * 这里的 onSearch 只被当作「要不要监听输入法事件」的真值判断，effect 体从不调它。
+ * 它直接进依赖数组，消费方传内联箭头就会每渲染一次拆装一次 window 监听。
+ */
+describe("useSelectComposition", () => {
+  let addSpy: ReturnType<typeof vi.spyOn>;
+
+  const countAdds = () =>
+    addSpy.mock.calls.filter(([type]) => type === "compositionstart").length;
+
+  beforeEach(() => {
+    addSpy = vi.spyOn(window, "addEventListener");
+  });
+  afterEach(() => {
+    addSpy.mockRestore();
+  });
+
+  it("没传 onSearch 不注册；从无到有传入时会注册", () => {
+    const { rerender } = renderHook(
+      ({ onSearch }: { onSearch?: (v: string) => void }) =>
+        useSelectComposition({ onSearch }),
+      { initialProps: {} as { onSearch?: (v: string) => void } },
+    );
+    expect(countAdds()).toBe(0);
+
+    rerender({ onSearch: () => {} });
+    expect(countAdds()).toBe(1);
+  });
+
+  it("onSearch 换引用不会反复拆装 window 监听", () => {
+    const { rerender } = renderHook(
+      ({ onSearch }: { onSearch?: (v: string) => void }) =>
+        useSelectComposition({ onSearch }),
+      { initialProps: { onSearch: () => {} } },
+    );
+    expect(countAdds()).toBe(1);
+
+    rerender({ onSearch: () => {} });
+    rerender({ onSearch: () => {} });
+    expect(countAdds()).toBe(1);
+  });
+});

package/src/components/Select/_hooks/useSelectComposition.ts

@@ -11,6 +11,7 @@ export function useSelectComposition({
   onSearch,
 }: UseSelectCompositionProps) {
   const [isComposing, setComposing] = useState<boolean>(false);
+  const hasOnSearch = !!onSearch;
 
   useEffect(() => {
     const compositionend = () => {
@@ -20,7 +21,7 @@ export function useSelectComposition({
       setComposing(true);
     };
 
-    if (onSearch) {
+    if (hasOnSearch) {
       window.addEventListener("compositionstart", compositionstart);
       window.addEventListener("compositionend", compositionend);
     }
@@ -29,7 +30,10 @@ export function useSelectComposition({
       window.removeEventListener("compositionstart", compositionstart);
       window.removeEventListener("compositionend", compositionend);
     };
-  }, [onSearch]);
+    // onSearch 在这里只被当作「要不要监听输入法事件」的真值判断，effect 体从不调它。
+    // 直接进依赖数组的话，消费方传内联箭头就会每渲染一次拆一次、装一次 window 监听；
+    // 只取「有没有传」这个布尔量，从无到有时照样会重新注册。
+  }, [hasOnSearch]);
 
   return { isComposing };
 }

package/src/components/Table/_hooks/useAutoScrolling.test.tsx

@@ -0,0 +1,95 @@
+import React, { useRef } from "react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { act, render, waitFor } from "@testing-library/react";
+
+import useAutoScrolling from "./useAutoScrolling";
+
+/**
+ * onAutoScrollEndAdd 在这个 hook 里身兼两职：既是「有没有加载更多」的开关，
+ * 又是真正去加载的动作。整条 rAF 循环挂在它的引用上（loop 依赖它、启停 effect 依赖 loop），
+ * 消费方传内联箭头就会每渲染一次重启一次滚动循环 —— 表格滚到一半被打回起点。
+ */
+
+const DATA = [{ key: "1" }, { key: "2" }];
+
+function Host({
+  onAutoScrollEndAdd,
+}: {
+  onAutoScrollEndAdd?: () => Promise<boolean>;
+}) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useAutoScrolling({
+    autoScrolling: true,
+    ref,
+    dataSource: DATA,
+    onAutoScrollEndAdd,
+  });
+
+  return (
+    <div ref={ref}>
+      <div className="ant-table-body">
+        <table>
+          <tbody className="ant-table-tbody" />
+        </table>
+      </div>
+    </div>
+  );
+}
+
+describe("useAutoScrolling", () => {
+  let cancelSpy: ReturnType<typeof vi.spyOn>;
+
+  beforeEach(() => {
+    // 让 rAF 不真的跑，cancelAnimationFrame 就只会由 effect 的 cleanup 触发，
+    // 于是「循环有没有被重启」可以直接数出来
+    vi.spyOn(window, "requestAnimationFrame").mockImplementation(
+      () => 1 as unknown as number,
+    );
+    cancelSpy = vi
+      .spyOn(window, "cancelAnimationFrame")
+      .mockImplementation(() => {});
+  });
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  /** hook 靠 MutationObserver 把自己标成 ready，这里手动改一次 DOM 触发它 */
+  const makeReady = async (container: HTMLElement) => {
+    await act(async () => {
+      container
+        .querySelector(".ant-table-tbody")!
+        .appendChild(document.createElement("tr"));
+      await Promise.resolve();
+    });
+    await waitFor(() =>
+      expect(window.requestAnimationFrame).toHaveBeenCalled(),
+    );
+  };
+
+  it("onAutoScrollEndAdd 换引用不会重启滚动循环", async () => {
+    const { container, rerender } = render(
+      <Host onAutoScrollEndAdd={() => Promise.resolve(true)} />,
+    );
+    await makeReady(container);
+
+    const before = cancelSpy.mock.calls.length;
+
+    rerender(<Host onAutoScrollEndAdd={() => Promise.resolve(true)} />);
+    rerender(<Host onAutoScrollEndAdd={() => Promise.resolve(true)} />);
+
+    expect(cancelSpy.mock.calls.length).toBe(before);
+  });
+
+  it("从无到有传入 onAutoScrollEndAdd 时会接上加载更多（循环按新开关重建一次）", async () => {
+    const { container, rerender } = render(<Host />);
+    await makeReady(container);
+
+    const before = cancelSpy.mock.calls.length;
+
+    rerender(<Host onAutoScrollEndAdd={() => Promise.resolve(true)} />);
+
+    // 开关从 false 变 true，循环必须按新语义重建，否则「加载更多」永远接不上
+    expect(cancelSpy.mock.calls.length).toBeGreaterThan(before);
+  });
+});

package/src/components/Table/_hooks/useAutoScrolling.ts

@@ -1,6 +1,7 @@
 import { useMutationObserver } from "ahooks";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { TableProps } from "..";
+import { useLatestRef } from "../../../hooks/useLatestRef";
 
 const DEFAULT_INTERVAL = 2000;
 const DEFAULT_SPEED = 25;
@@ -39,6 +40,13 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
     autoScrollingOffset = 0,
   } = props;
 
+  // onAutoScrollEndAdd 在这里身兼两职：既是「有没有加载更多」的开关，又是真正去加载的动作。
+  // 整个 rAF 循环（loop → 依赖它 → 启停 effect 依赖 loop）都挂在它的引用上，
+  // 消费方传内联箭头就会每渲染一次重启一次滚动循环 —— 表格滚到一半被打回起点。
+  // 拆成两半：开关看布尔量（从无到有传入时仍会正确接上加载更多），动作取 ref 里的最新引用。
+  const onAutoScrollEndAddRef = useLatestRef(onAutoScrollEndAdd);
+  const hasOnAutoScrollEndAdd = !!onAutoScrollEndAdd;
+
   const validSpeed =
     autoScrollingSpeed > 0 ? autoScrollingSpeed : DEFAULT_SPEED;
   const smoothStep = (validSpeed * SMOOTH_SCROLL_TICK) / 1000;
@@ -324,12 +332,13 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
   );
 
   const runLoadMore = useCallback(() => {
-    if (!onAutoScrollEndAdd || pendingLoadMoreRef.current) return;
+    const loadMore = onAutoScrollEndAddRef.current;
+    if (!loadMore || pendingLoadMoreRef.current) return;
     pendingLoadMoreRef.current = true;
     phaseRef.current = "loading";
     const token = ++loadTokenRef.current;
 
-    onAutoScrollEndAdd()
+    loadMore()
       .then((hasMore) => {
         if (token !== loadTokenRef.current) return;
         const currentBody = getBody();
@@ -352,7 +361,7 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
         if (token !== loadTokenRef.current) return;
         pendingLoadMoreRef.current = false;
       });
-  }, [autoScrollLoop, getBody, onAutoScrollEndAdd]);
+  }, [autoScrollLoop, getBody, onAutoScrollEndAddRef]);
 
   const loop = useCallback(() => {
     rafRef.current = requestAnimationFrame(loop);
@@ -391,7 +400,7 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
         // In seamless mode the scroll never actually reaches the bottom; just keep scrolling
         phaseRef.current = "idle";
       } else if (isAtBottom(body)) {
-        if (onAutoScrollEndAdd) {
+        if (hasOnAutoScrollEndAdd) {
           runLoadMore();
         } else {
           if (autoScrollLoop) {
@@ -457,7 +466,7 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
     isAtBottom,
     isBodyScrollable,
     isSeamless,
-    onAutoScrollEndAdd,
+    hasOnAutoScrollEndAdd,
     ready,
     ref,
     runLoadMore,
@@ -506,7 +515,7 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
       return;
     }
 
-    if (onAutoScrollEndAdd) {
+    if (hasOnAutoScrollEndAdd) {
       // In load-more mode, if scrolling had stopped, resume auto-scrolling when new data arrives
       if (phaseRef.current === "stopped") {
         phaseRef.current = autoScrollMode === "row" ? "wait" : "idle";
@@ -530,7 +539,7 @@ const useAutoScrolling = (props: UseAutoScrollingProps) => {
     interval,
     isBodyScrollable,
     isSeamless,
-    onAutoScrollEndAdd,
+    hasOnAutoScrollEndAdd,
   ]);
 
   useEffect(() => {

package/src/layout/Menu/_hooks/useOnlyLvOneMenu.test.tsx

@@ -0,0 +1,56 @@
+import React, { useState } from "react";
+import { describe, expect, it, vi } from "vitest";
+import { render } from "@testing-library/react";
+import { MemoryRouter } from "react-router-dom";
+
+import { useOnlyLvOneMenu } from "./useOnlyLvOneMenu";
+import type { MenuType } from "..";
+
+const ITEMS = [
+  { key: "/orch", label: "编排", children: [{ key: "/orch/a", label: "A" }] },
+] as unknown as MenuType[];
+
+/**
+ * 这个 effect 干的是：路由变了就把当前一级菜单的子项交给消费方，并同步展开态。
+ * getCurrChildItems 是 effect 体里发出去的通知 —— 它进依赖数组，
+ * 配上每次都新建数组的 setOpenkeys([item.key])，就是标准的死循环配方。
+ */
+function Host({ onChildren }: { onChildren: (c: MenuType[]) => void }) {
+  const [, setOpenkeys] = useState<string[]>([]);
+  const [, setMenuKey] = useState("");
+  const [children, setChildren] = useState<MenuType[]>([]);
+
+  useOnlyLvOneMenu({
+    items: ITEMS,
+    onlyLvOneMenu: true,
+    // 内联箭头 + 每次都是新数组：最坏情况的消费方写法
+    getCurrChildItems: (c) => {
+      onChildren(c);
+      setChildren([...c]);
+    },
+    setOpenkeys,
+    setMenuKey,
+  });
+
+  return <div data-testid="count">{children.length}</div>;
+}
+
+describe("useOnlyLvOneMenu", () => {
+  it("内联 getCurrChildItems 回写 state 不会死循环", () => {
+    const spy = vi.fn();
+
+    const { getByTestId } = render(
+      <MemoryRouter
+        initialEntries={["/orch/a"]}
+        future={{ v7_startTransition: true, v7_relativeSplatPath: true }}
+      >
+        <Host onChildren={spy} />
+      </MemoryRouter>,
+    );
+
+    expect(getByTestId("count").textContent).toBe("1");
+    // 进了循环这里会是几十上百次，直到 React 抛 Maximum update depth exceeded
+    expect(spy.mock.calls.length).toBeLessThanOrEqual(2);
+    expect(spy).toHaveBeenCalledWith(ITEMS[0].children);
+  });
+});

package/src/layout/Menu/_hooks/useOnlyLvOneMenu.ts

@@ -1,4 +1,5 @@
 import { useEffect } from "react";
+import { useLatestRef } from "../../../hooks/useLatestRef";
 import { useLocation } from "react-router";
 import { MenuType } from "..";
 
@@ -21,6 +22,11 @@ export const useOnlyLvOneMenu = ({
   setMenuKey,
 }: UseOnlyLvOneMenuOptions) => {
   const location = useLocation();
+  // getCurrChildItems 是 effect 体里发出去的通知，本身进依赖数组是这一类死循环的标准配方：
+  // 消费方传内联箭头 → 每次渲染新引用 → effect 重跑 → setOpenkeys([item.key]) 每次都是
+  // 新数组必定触发重渲染 → 又是新引用 …… 直到 React 抛 Maximum update depth exceeded。
+  // 通知取 ref 里的最新引用，依赖数组只留真正的输入。
+  const getCurrChildItemsRef = useLatestRef(getCurrChildItems);
 
   useEffect(() => {
     if (onlyLvOneMenu) {
@@ -28,14 +34,14 @@ export const useOnlyLvOneMenu = ({
         (i) => i.key === "/" + location.pathname.split("/").filter(Boolean)[0]
       );
       if (item) {
-        getCurrChildItems?.(item.children || []);
+        getCurrChildItemsRef.current?.(item.children || []);
         setOpenkeys([item.key]);
         setMenuKey(item.key);
       }
     }
   }, [
     items,
-    getCurrChildItems,
+    getCurrChildItemsRef,
     location,
     onlyLvOneMenu,
     setOpenkeys,