本文整理汇总了TypeScript中@ephox/alloy.Focusing.focus方法的典型用法代码示例。如果您正苦于以下问题:TypeScript Focusing.focus方法的具体用法?TypeScript Focusing.focus怎么用?TypeScript Focusing.focus使用的例子?那么, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类@ephox/alloy.Focusing
的用法示例。
在下文中一共展示了Focusing.focus方法的5个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1:
const onLeftOrRightInMenu = (comp: AlloyComponent, se: SimulatedEvent<SugarEvent>) => {
// The originating dropdown is stored on the sandbox itself.
const dropdown: AlloyComponent = Representing.getValue(comp);
// Focus the dropdown. Current workaround required to make flow recognise the current focus
Focusing.focus(dropdown);
AlloyTriggers.emitWith(dropdown, 'keydown', {
raw: se.event().raw()
});
// Close the dropdown
AlloyDropdown.close(dropdown);
return Option.some(true);
};
示例2: callback
const open = (message: string, callback: (state: boolean) => void) => {
const closeDialog = (state: boolean) => {
ModalDialog.hide(confirmDialog);
callback(state);
};
const memFooterYes = Memento.record(
renderFooterButton({
name: 'yes',
text: 'Yes',
primary: true,
icon: Option.none()
}, 'submit', sharedBackstage.providers)
);
const footerNo = renderFooterButton({
name: 'no',
text: 'No',
primary: true,
icon: Option.none()
}, 'cancel', sharedBackstage.providers);
const confirmDialog = GuiFactory.build(
Dialogs.renderDialog({
lazySink: () => sharedBackstage.getSink(),
partSpecs: {
title: Dialogs.pUntitled(),
close: Dialogs.pClose(() => {
closeDialog(false);
}, sharedBackstage.providers),
body: Dialogs.pBodyMessage(message, sharedBackstage.providers),
footer: Dialogs.pFooter(Dialogs.pFooterGroup([], [
footerNo,
memFooterYes.asSpec()
]))
},
onCancel: () => closeDialog(false),
onSubmit: () => closeDialog(true),
extraClasses: [ 'tox-confirm-dialog' ]
})
);
ModalDialog.show(confirmDialog);
const footerYesButton = memFooterYes.get(confirmDialog);
Focusing.focus(footerYesButton);
};
示例3: callback
const open = (message: string, callback: () => void) => {
const closeDialog = () => {
ModalDialog.hide(alertDialog);
callback();
};
const memFooterClose = Memento.record(
renderFooterButton({
name: 'close-alert',
text: 'OK',
primary: true,
icon: Option.none()
}, 'cancel', sharedBackstage.providers)
);
const alertDialog = GuiFactory.build(
Dialogs.renderDialog({
lazySink: () => sharedBackstage.getSink(),
partSpecs: {
title: Dialogs.pUntitled(),
close: Dialogs.pClose(() => {
closeDialog();
}, sharedBackstage.providers),
body: Dialogs.pBodyMessage(message, sharedBackstage.providers),
footer: Dialogs.pFooter(Dialogs.pFooterGroup([], [
memFooterClose.asSpec()
]))
},
onCancel: () => closeDialog(),
onSubmit: Fun.noop,
extraClasses: [ 'tox-alert-dialog' ]
})
);
ModalDialog.show(alertDialog);
const footerCloseButton = memFooterClose.get(alertDialog);
Focusing.focus(footerCloseButton);
};
示例4:
comp.getSystem().getByDom(hoveredButton).each((hoveredComp) => {
Dropdown.expand(hoveredComp);
Dropdown.close(activeComp);
Focusing.focus(hoveredComp);
});
示例5:
Step.sync(() => {
Focusing.focus(input);
}),