本文整理匯總了TypeScript中phosphor/lib/ui/vdom.h類的典型用法代碼示例。如果您正苦於以下問題:TypeScript h類的具體用法?TypeScript h怎麽用?TypeScript h使用的例子?那麽, 這裏精選的類代碼示例或許可以為您提供幫助。
在下文中一共展示了h類的4個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: render
/**
* Render the content as virtual DOM nodes.
*/
protected render(): VNode | VNode[] {
if (!this.model) {
return h.table([h.thead(), h.tbody()]);
}
let rows = this.model.parse();
let cols = rows.columns || [];
return h.table([
h.thead(cols.map(col => h.th(col))),
h.tbody(rows.map(row => h.tr(cols.map(col => h.td(row[col])))))
]);
}
示例2: it
it('should connect a node to a command', () => {
let called = false;
let command = 'commandlinker:connect-node';
let commands =new CommandRegistry();
let linker = new CommandLinker({ commands });
let node: HTMLElement;
let vnode: VNode;
let disposable = commands.addCommand(command, {
execute: () => { called = true; }
});
let attrs: IElementAttrs = {};
vnode = h.div(linker.populateVNodeAttrs(attrs, command, null));
node = realize(vnode);
document.body.appendChild(node);
expect(called).to.be(false);
simulate(node, 'click');
expect(called).to.be(true);
document.body.removeChild(node);
linker.dispose();
disposable.dispose();
});
示例3: render
/**
* Render the landing plugin to virtual DOM nodes.
*/
protected render(): VNode {
let activitiesList: VNode[] = [];
let activites = this.model.activities;
for (let activityName of activites) {
let imgName = activityName[0].replace(' ', '');
let column =
h.div({className: LANDING_COLUMN_CLASS},
h.span({className: LANDING_ICON_CLASS + ` jp-Image${imgName}` ,
onclick: () => {
this._app.commands.execute(activityName[1], void 0);
}}
),
h.span({className: LANDING_TEXT_CLASS}, activityName[0])
);
activitiesList.push(column);
}
let logo = h.span({className: JUPYTERLAB_ICON_CLASS + ' ' + LANDING_LOGO_CLASS});
let subtitle =
h.span({className: LANDING_SUBTITLE_CLASS},
this.model.previewMessage
);
let tour =
h.span({className: TOUR_ICON_CLASS,
onclick: () => {
this._app.commands.execute('about-jupyterlab:show', void 0);
}}
);
let header = h.span({
className: LANDING_HEADER_CLASS
}, this.model.headerText);
let body = h.div({className: LANDING_BODY_CLASS}, activitiesList);
let dialog = h.div({className: LANDING_DIALOG_CLASS},
logo,
subtitle,
tour,
header,
body,
h.div({className: LANDING_CWD_CLASS},
h.span({className: FOLDER_ICON_CLASS + ' ' + FOLDER_CLASS}),
h.span({className: LANDING_PATH_CLASS}, this.model.path
)
)
);
return dialog;
}
示例4:
h.tbody(rows.map(row => h.tr(cols.map(col => h.td(row[col])))))