本文整理汇总了TypeScript中@phosphor/widgets.TabBar类的典型用法代码示例。如果您正苦于以下问题：TypeScript TabBar类的具体用法？TypeScript TabBar怎么用？TypeScript TabBar使用的例子？那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了TabBar类的2个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: each
activate: (app: JupyterLab, restorer: ILayoutRestorer): void => {
const { shell } = app;
const tabs = new TabBar<Widget>({ orientation: 'vertical' });
const header = document.createElement('header');
restorer.add(tabs, 'tab-manager');
tabs.id = 'tab-manager';
tabs.title.label = 'Tabs';
header.textContent = 'Open Tabs';
tabs.node.insertBefore(header, tabs.contentNode);
shell.addToLeftArea(tabs, { rank: 600 });
app.restored.then(() => {
const populate = () => {
tabs.clearTabs();
each(shell.widgets('main'), widget => { tabs.addTab(widget.title); });
};
// Connect signal handlers.
shell.layoutModified.connect(() => { populate(); });
tabs.tabActivateRequested.connect((sender, tab) => {
shell.activateById(tab.title.owner.id);
});
tabs.tabCloseRequested.connect((sender, tab) => {
tab.title.owner.close();
});
// Populate the tab manager.
populate();
});
},示例2: each
activate: (
app: JupyterFrontEnd,
labShell: ILabShell | null,
restorer: ILayoutRestorer | null
): void => {
const { shell } = app;
const tabs = new TabBar<Widget>({ orientation: 'vertical' });
const header = document.createElement('header');
if (restorer) {
restorer.add(tabs, 'tab-manager');
}
tabs.id = 'tab-manager';
tabs.title.iconClass = 'jp-TabIcon jp-SideBar-tabIcon';
tabs.title.caption = 'Open Tabs';
header.textContent = 'Open Tabs';
tabs.node.insertBefore(header, tabs.contentNode);
shell.add(tabs, 'left', { rank: 600 });
void app.restored.then(() => {
const populate = () => {
tabs.clearTabs();
each(shell.widgets('main'), widget => {
tabs.addTab(widget.title);
});
};
// Connect signal handlers.
tabs.tabActivateRequested.connect((sender, tab) => {
shell.activateById(tab.title.owner.id);
});
tabs.tabCloseRequested.connect((sender, tab) => {
tab.title.owner.close();
populate();
});
// If available, connect to the shell's layout modified signal.
if (labShell) {
labShell.layoutModified.connect(() => {
populate();
});
}
// Populate the tab manager.
populate();
});
},