首页 > 解决方案 > 如果在 extjs 中的上下文菜单的侦听器内有其他条件

问题描述

我的网格上下文菜单具有以下功能。我在控制器中有两个功能,我正在对上下文菜单进行 api 调用(用于启用和禁用)。这些函数是用于禁用上下文菜单的“disableRule”和用于启用上下文菜单的“enableRule”。我正在检查网格行的状态以在上下文菜单中展示菜单,并且我将这个状态存储在启用的变量中。现在我想调用禁用和启用上下文菜单的函数。如何根据条件调用这两个函数。对于 gridText 我想根据条件调用函数。

itemcontextmenu: function (grid, record, item, index, e) {

            var enabled = grid.getStore().getAt(index).get( 'enabled' ) == 1 ? true : false;
            if(enabled){
                gridText = 'Disable'
            } else {
                gridText = 'Enable'
            }
            var contextMenu = Ext.create('Ext.menu.Menu', {
                controller: 'administration-ipaccessmanagement',
                width: 100,
                plain: true,
                items: [{
                    text: 'Delete',
                    listeners: {
                        click: {fn: 'deleteRule', extra: record}
                    }
                },{
                    text: gridText,
                    listeners: {
                            click: {fn: 'disableRule', extra: record}
                    }
                }

                ]
            });
            e.stopEvent();
            contextMenu.showAt(e.getXY());
        }

标签: extjs

解决方案


您可以添加基于enabled. 您只需动态创建一个菜单项(按钮)。

itemcontextmenu: function (grid, record, item, index, e) {

    const enabled = !!grid.getStore().getAt(index).get( 'enabled' );

    const enableDisableItem = {
        text: enabled ? 'Enable' : 'Disable',
        listeners: {
            click: {
                fn: enabled ? 'enableRule' : 'disableRule',
                extra: record
            }
        }
    };


    var contextMenu = Ext.create('Ext.menu.Menu', {
            controller: 'administration-ipaccessmanagement',
            width: 100,
            plain: true,
            items: [{
                text: 'Delete',
                listeners: {
                    click: {fn: 'deleteRule', extra: record}
                }
            },
                enableDisableItem
            ]
        });

    e.stopEvent();
    contextMenu.showAt(e.getXY());
}

推荐阅读