javascript - EXTJS 5 - 如何禁用菜单中的某些项目

Question

我正在使用菜单来显示网格中行的多个选项。菜单正确显示文本，我希望能够动态禁用其中一些选项。

这是我的菜单:

Ext.create('Ext.menu.Menu', {
items: [{
    text: 'option 1'
},{
    text: 'option 2'
},{
    text: 'option 3'
}]
});

我尝试为每个项目提供一个 id 并通过 id 禁用它，但我的控制台中出现错误

Uncaught TypeError: Cannot read property 'contains' of undefined(…)

有人知道这个问题的解决办法吗？

Answer 1

你只需要调用方法 disable上menuitem .

var item = Ext.first('#mySpecialMenuItem');
item.disable();

类似这样的事情:

{
    xtype: 'menu',
    floating: false,
    id: 'myMenu',
    width: 120,
    items: [
        {
            xtype: 'menuitem',
            id: 'mySpecialMenuItem',
            text: 'Menu Item'
        },
        {
            xtype: 'menuitem',
            text: 'Menu Item'
        },
        {
            xtype: 'menuitem',
            text: 'Menu Item'
        }
    ]
},
{
    xtype: 'button',
    handler: function(button, e) {
        // somehow get the item
        var item = Ext.first('#mySpecialMenuItem');
        // call disable
        item.disable();

    },
    text: 'Disable Item'
}

查看此 fiddle 中的完整示例 https://fiddle.sencha.com/#view/editor&fiddle/1m2q