iter(g117): 指示条与滑块跟随尺寸重算
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user