ExtJS 6 - 隐藏组件时停止事件委派?

时间:2016-04-18 07:06:08

标签: javascript extjs extjs6 event-delegation

我必须在它的模糊事件中隐藏相同的字段。

Extjs 6在组件隐藏方法上调用事件委托。Event delegation revert focus to last field which had focus

并且,我不希望这个恢复焦点。有什么方法可以stop event delegation隐藏extjs中的元素吗?

活动授权附带extjs 5 - Delegated Events and Gestures in Ext JS 5

用于隐藏的方法 - https://docs.sencha.com/extjs/6.0/6.0.1-classic/#!/api/Ext.Component-method-onHide

来自ExtJS源代码的

onHide()方法 - 检查revertFocus()

onHide: function(animateTarget, cb, scope) {
    var me = this,
        ghostPanel, fromSize, toBox;
    if (!me.ariaStaticRoles[me.ariaRole]) {
        me.ariaEl.dom.setAttribute('aria-hidden', true);
    }
    // Part of the Focusable mixin API.
    // If we have focus now, move focus back to whatever had it before.
    me.revertFocus(); // this revert focus making probelm
    // Default to configured animate target if none passed
    animateTarget = me.getAnimateTarget(animateTarget);
    // Need to be able to ghost the Component
    if (!me.ghost) {
        animateTarget = null;
    }
    // If we're animating, kick off an animation of the ghost down to the target
    if (animateTarget) {
        toBox = {
            x: animateTarget.getX(),
            y: animateTarget.getY(),
            width: animateTarget.dom.offsetWidth,
            height: animateTarget.dom.offsetHeight
        };
        ghostPanel = me.ghost();
        ghostPanel.el.stopAnimation();
        fromSize = me.getSize();
        ghostPanel.el.animate({
            to: toBox,
            listeners: {
                afteranimate: function() {
                    delete ghostPanel.componentLayout.lastComponentSize;
                    ghostPanel.el.hide();
                    ghostPanel.setHiddenState(true);
                    ghostPanel.el.setSize(fromSize);
                    me.afterHide(cb, scope);
                }
            }
        });
    }
    me.el.hide();
    if (!animateTarget) {
        me.afterHide(cb, scope);
    }
},

3 个答案:

答案 0 :(得分:1)

当模糊事件触发时,在viewcontroller中调用的函数中使用suspendEventsresumeEvents

stopEvents不是suspendEvents。我的错。 :P

blurEventFunction:function(cmp){
    cmp.suspendEvents();
    cmp.hide();
    camp.resumeEvents();
}

答案 1 :(得分:1)

你做错了,revertFocus()是一个主要的问题来源。解决方案可能是:

blurEventFunction:function(cmp){
    cmp.previousFocus = null;
    cmp.hide();
}

答案 2 :(得分:1)

我遇到了同样的问题。 (extjs 6.5.1 - 使用带有closeAction的模态窗口:'hide')

我正在调试代码,似乎发生了,因为最新的字段集中在一个面板中,我的模态窗口不是该面板的子代。 (似乎extjs获取模态窗口的祖先以找到最新的聚焦场,然后设置焦点)

当我将窗口添加到该面板时,它工作正常。 (当模态窗口关闭时,焦点在于打开窗口之前聚焦的最新场)。

调试Ext.util.Focusable类,我看到了一个名为preventRefocus的配置。如果在模态窗口中添加值为true的config,则不会执行revertFocus函数的内容,也不会出现错误。

hero

我希望将来可以帮助某人。