@huibo-ui/react-antd 1.0.9 → 1.0.10

package/lib/components/Tabs.d.ts

@@ -12,6 +12,8 @@ export interface TabItemType {
     label?: React.ReactNode;
     children?: React.ReactNode;
     disabled?: boolean;
+    /** 强制预渲染（即使非 active 也渲染）。对齐 antd forceRender，默认 false。 */
+    forceRender?: boolean;
     [k: string]: any;
 }
 export interface TabsProps {

package/lib/components/Tabs.js

@@ -50,10 +50,27 @@ export function Tabs(props) {
                             background: PRIMARY,
                         } }))] }, it.key));
         }) }));
+    // 对齐 antd Tabs 默认的渲染策略：
+    // - destroyInactiveTabPane=true：只渲染当前 active（切换即销毁旧的）
+    // - 默认（lazy keep-alive）：只渲染「当前 active」和「曾经 active 过」的；
+    //   从未激活过的 tab 不渲染 children（避免其内部副作用/接口被提前触发）。
+    //   forceRender=true 的 tab 始终渲染。
+    const visitedRef = React.useRef(new Set());
+    if (current)
+        visitedRef.current.add(current);
+    // activeKey 受控切换时清理已销毁的 key（避免 Set 无限增长）
+    const validKeys = new Set(list.map(it => it.key));
+    visitedRef.current = new Set([...visitedRef.current].filter(k => validKeys.has(k)));
     const activeItem = list.find(it => it.key === current);
     const panels = (_jsxs("div", { style: { flex: 1, minWidth: 0, padding: vertical ? '0 16px' : '16px 0' }, children: [destroyInactiveTabPane
                 ? activeItem?.children
-                : list.map(it => (_jsx("div", { style: { display: it.key === current ? 'block' : 'none' }, children: it.children }, it.key))), !items || items.length === 0 ? children : null] }));
+                : list.map(it => {
+                    const visited = visitedRef.current.has(it.key);
+                    const shouldRender = it.forceRender || visited;
+                    if (!shouldRender)
+                        return _jsx("div", { style: { display: 'none' } }, it.key);
+                    return (_jsx("div", { style: { display: it.key === current ? 'block' : 'none' }, children: it.children }, it.key));
+                }), !items || items.length === 0 ? children : null] }));
     return (_jsxs("div", { className: className, style: {
             display: 'flex',
             flexDirection: vertical ? 'row' : 'column',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@huibo-ui/react-antd",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "antd 兼容层 — 接收 antd 原生 props，内部转换为 huibo-ui，实现丝滑平替",
   "type": "module",
   "main": "lib/index.js",