当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript SystemEvents.detachedFromDom方法代码示例

本文整理汇总了TypeScript中@ephox/alloy.SystemEvents.detachedFromDom方法的典型用法代码示例。如果您正苦于以下问题:TypeScript SystemEvents.detachedFromDom方法的具体用法?TypeScript SystemEvents.detachedFromDom怎么用?TypeScript SystemEvents.detachedFromDom使用的例子?那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在@ephox/alloy.SystemEvents的用法示例。


在下文中一共展示了SystemEvents.detachedFromDom方法的1个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: onEscape

const renderModalDialog = (spec: DialogSpec, initialData, dialogEvents: AlloyEvents.AlloyEventKeyAndHandler<any>[], backstage: UiFactoryBackstage) => {
  const updateState = (_comp, incoming) => {
    return Option.some(incoming);
  };

  return GuiFactory.build(
    ModalDialog.sketch({
      lazySink: backstage.shared.getSink,
      // TODO: Disable while validating
      onEscape(c) {
        AlloyTriggers.emit(c, formCancelEvent);
        return Option.some(true);
      },

      useTabstopAt: (elem) => {
        return !NavigableObject.isPseudoStop(elem) && (
          Node.name(elem) !== 'button' || Attr.get(elem, 'disabled') !== 'disabled'
        );
      },

      modalBehaviours: Behaviour.derive([
        Reflecting.config({
          channel: dialogChannel,
          updateState,
          initialData
        }),
        RepresentingConfigs.memory({ }),
        Focusing.config({}),
        AddEventsBehaviour.config('execute-on-form', dialogEvents.concat([
          AlloyEvents.runOnSource(NativeEvents.focusin(), (comp, se) => {
            Keying.focusIn(comp);
          })
        ])),
        AddEventsBehaviour.config('scroll-lock', [
          AlloyEvents.runOnAttached(() => {
            Class.add(Body.body(), 'tox-dialog__disable-scroll');
          }),
          AlloyEvents.runOnDetached(() => {
            Class.remove(Body.body(), 'tox-dialog__disable-scroll');
          }),
        ]),
        ...spec.extraBehaviours
      ]),

      eventOrder: {
        [SystemEvents.execute()]: [ 'execute-on-form' ],
        [SystemEvents.receive()]: [ 'reflecting', 'receiving' ],
        [SystemEvents.attachedToDom()]: [ 'scroll-lock', 'reflecting', 'messages', 'execute-on-form', 'alloy.base.behaviour' ],
        [SystemEvents.detachedFromDom()]: [ 'alloy.base.behaviour', 'execute-on-form', 'messages', 'reflecting', 'scroll-lock' ],
      },

      dom: {
        tag: 'div',
        classes: [ 'tox-dialog' ].concat(spec.extraClasses),
        styles: {
          position: 'relative',
          ...spec.extraStyles
        }
      },
      components: [
        spec.header,
        spec.body,
        ...spec.footer.toArray()
      ],
      dragBlockClass: 'tox-dialog-wrap',
      parts: {
        blocker: {
          dom: DomFactory.fromHtml('<div class="tox-dialog-wrap"></div>'),
          components: [
            {
              dom: {
                tag: 'div',
                classes: [ 'tox-dialog-wrap__backdrop' ]
              }
            }
          ]
        }
      }
    })
  );
};
开发者ID:tinymce,项目名称:tinymce,代码行数:81,代码来源:SilverDialogCommon.ts


注:本文中的@ephox/alloy.SystemEvents.detachedFromDom方法示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。