iter(g212): 页签溢出时自动把激活页签拉回可视区
This commit is contained in:
@@ -181,6 +181,8 @@ const closableTabs = signal([
|
||||
{ value: 'n3', label: '订单 #1026', closable: true },
|
||||
]);
|
||||
const closableActive = signal('n1');
|
||||
// —— 溢出页签:容器装不下时,切到被裁掉的页签应自动拉回可视区 ——
|
||||
const wideTab = signal('t0');
|
||||
const modalOpen = signal(false);
|
||||
const modalPick = signal('a'); // 弹窗内下拉的取值,用于演示 Esc 逐层关闭
|
||||
|
||||
@@ -583,6 +585,11 @@ const content = h(
|
||||
},
|
||||
})];
|
||||
}),
|
||||
h('div', { style: 'max-width:320px;width:100%' }, tabs({
|
||||
tabs: Array.from({ length: 8 }, (_, i) => ({ value: `t${i}`, label: `选项 ${i + 1}` })), // 八个页签必然溢出,用来验证自动回拉
|
||||
active: wideTab,
|
||||
})),
|
||||
h('span', { class: 'out' }, () => `溢出演示当前页签:${wideTab()}(点最右侧的页签,标题条会自动滚过去)`),
|
||||
button({ label: '打开弹窗', onClick: () => modalOpen(true) }),
|
||||
button({ label: '打开防误关弹窗', variant: 'ghost', onClick: () => stickyOpen(true) }),
|
||||
modal(
|
||||
|
||||
Reference in New Issue
Block a user