iter(g117): 指示条与滑块跟随尺寸重算

This commit is contained in:
HIsheR
2026-10-26 14:11:09 +08:00
parent dcd5e0e818
commit 6cf4905a71
4 changed files with 24 additions and 1 deletions
+4 -1
View File
@@ -1,5 +1,6 @@
import { effect, h } from '@ui-arch/frame';
import type { TabItem, TabsProps } from './types.js';
import { trackSize } from './watch.js';
/*** 标签页:active 信号双向绑定 + 滑动指示条 + 方向键环形导航;closable 页签带关闭按钮(聚焦后 Delete 亦可关) ***/
export function tabs(props: TabsProps): HTMLElement {
@@ -63,7 +64,9 @@ export function tabs(props: TabsProps): HTMLElement {
next?.click();
});
const root = h('div', { class: 'ua-tabs' }, head);
effect(sync);
requestAnimationFrame(sync); // 挂载后再量一次布局,否则指示条宽度为 0
return h('div', { class: 'ua-tabs' }, head);
trackSize(root, sync); // 容器变宽 / 窗口缩放后重算,指示条不会停在旧宽度
return root;
}