本文整理汇总了TypeScript中@ephox/alloy.AlloyComponent类的典型用法代码示例。如果您正苦于以下问题:TypeScript AlloyComponent类的具体用法?TypeScript AlloyComponent怎么用?TypeScript AlloyComponent使用的例子?那么, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了AlloyComponent类的7个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1:
const deriveRepresenting = (spec, component: AlloyComponent) => {
if (component.hasConfigured(Representing)) {
const item = Representing.getValue(component);
return {
itemValue: () => item.value,
itemText: () => item.text,
};
}
};
示例2:
outerContainer.getSystem().getByDom(elm).each((comp: AlloyComponent) => {
if (comp.hasConfigured(Disabling)) {
if (e.mode === 'readonly') {
Disabling.disable(comp);
} else {
Disabling.enable(comp);
}
}
});
示例3: encodeURIComponent
setValue: (frameComponent: AlloyComponent, html: string) => {
if (!isSandbox) {
Attr.set(frameComponent.element(), 'src', 'javascript:\'\'');
// IE 6-11 doesn't support data uris on iframeComponents
// and Edge only supports upto ~4000 chars in data uris
// so I guess they will have to be less secure since we can't sandbox on those
// TODO: Use sandbox if future versions of IE/Edge supports iframeComponents with data: uris.
const doc = frameComponent.element().dom().contentWindow.document;
doc.open();
doc.write(html);
doc.close();
} else {
Attr.set(frameComponent.element(), 'src', 'data:text/html;charset=utf-8,' + encodeURIComponent(html));
}
cachedValue.set(html);
}
示例4: renderSpinner
const toggleThrobber = (comp: AlloyComponent, state: boolean, providerBackstage: UiFactoryBackstageProviders) => {
const element = comp.element();
if (state === true) {
Replacing.set(comp, [ renderSpinner(providerBackstage) ]);
Css.remove(element, 'display');
Attr.remove(element, 'aria-hidden');
} else {
Replacing.set(comp, [ ]);
Css.set(element, 'display', 'none');
Attr.set(element, 'aria-hidden', 'true');
}
};
示例5:
const getButton = (selector: string) => {
return component.getSystem().getByDom(
SelectorFind.descendant(component.element(), selector).getOrDie(
`Could not find button defined by: ${selector}`
)
).getOrDie();
};
示例6:
setActive: (state) => {
// Toggle the pressed aria state component
Attr.set(comp.element(), 'aria-pressed', state);
// Toggle the inner button state, as that's the toggle component of the split button
SelectorFind.descendant(comp.element(), 'span').each((button) => {
comp.getSystem().getByDom(button).each((buttonComp) => Toggling.set(buttonComp, state));
});
},
示例7: getButton
(() => {
const button2 = getButton('.button2-container .tox-tbtn');
return Logger.ts('Second button (button2): toggle button', [
Step.sync(() => {
shouldDisable.set(false);
shouldActivate.set(false);
}),
Mouse.sClickOn(component.element(), '.button2-container .tox-tbtn'),
store.sAssertEq('Store should have action2', [ 'onToggleAction.2' ]),
store.sClear,
sAssertButtonDisabledState('Enabled', false, button2),
sAssertButtonActiveState('Off', false, button2),
Step.sync(() => {
shouldActivate.set(true);
}),
Mouse.sClickOn(component.element(), '.button2-container .tox-tbtn'),
store.sAssertEq('Store should have action2', [ 'onToggleAction.2' ]),
store.sClear,
sAssertButtonDisabledState('Disabled', false, button2),
sAssertButtonActiveState('Off', true, button2),
Step.sync(() => {
shouldActivate.set(false);
}),
Mouse.sClickOn(component.element(), '.button2-container .tox-tbtn'),
store.sAssertEq('Store should have action2', [ 'onToggleAction.2' ]),
store.sClear,
sAssertButtonDisabledState('Disabled', false, button2),
sAssertButtonActiveState('Off', false, button2),
Step.sync(() => {
shouldDisable.set(true);
}),
Mouse.sClickOn(component.element(), '.button2-container .tox-tbtn'),
store.sAssertEq('Store should now have action2', [ 'onToggleAction.2' ]),
store.sClear,
sAssertButtonDisabledState('Disabled', true, button2),
sAssertButtonActiveState('Off still', false, button2)
]);
})(),