javascript - ExtJS5 如何让keymap调用viewController函数？

Question

我想知道如何从 extjs 5 中的键盘映射调用 Controller 函数？

View 中的以下代码用于将键绑定(bind)到匿名函数，但不绑定(bind)到 Controller 函数。该函数也由按钮调用，并且正在运行。如何正确设置调用 Controller 函数的范围？

Ext.define("MyApp.view.users.List",{
    extend: 'Ext.grid.Panel',
    alias: 'widget.usersList',
    controller: 'users-list',
    listeners: {
        scope: 'controller',
        afterrender: function(window, options) {
            this.keyNav = new Ext.util.KeyMap ({
                target:window.el,
                binding: [
                    {key:"s", ctrl:true, fn: function(){alert("hallo shortkey");}},
                    {key:"c", ctrl:true, fn: "newUserFn"},
                ],
                scope:'controller'
            });
        }
    },
    tbar: [
        {
            itemId: 'users-list-btn-new',
            iconCls: 'icon-add',
            text: 'New User',
            handler: 'newUserFn'
        }
    ]
});

Answer 1

我在按键事件范围方面也遇到了类似的问题。我没有像您一样使用 KeyMap，但事件逻辑仍然相关。

以下假设 Controller 具有您要调用的方法“saveNewComponent”。您必须触发 View 中正在监听的 View 事件“callSave”，才能正确转发到 Controller 。

Ext.define('teams.view.component.FormPanel', {
    extend: 'Ext.form.Panel',
    controller: "FormPanelController",
    listeners: {
        callSave: "saveNewComponent"
    },
    beforeShow: function(){     
        var me = this;
        me.body.dom.addEventListener("keydown", Ext.bind(onKeyDown, this), false);
        function onKeyDown(e) {
            //Listen for Ctrl+S
            if (e.ctrlKey && e.which === 83){
                e.preventDefault(); 
                me.fireEvent("callSave");
                return false;
            }
        }
    },
    ....
}

我尝试了很多方法来实现这一目标，这个解决方案是唯一一个在实际位于 Controller 内部时具有正确上下文的解决方案(即 this var 是正确的)