Extjs 在ext js中隐藏操作列项

我想在条件下隐藏操作列项目，请查看下面的代码

{
 xtype: 'actioncolumn',
 flex: 1,
 sortable: false,
 menuDisabled: true,
 align: 'center',
 items: [{

     icon: (fleet.rolerightscreate.modulerights('Editmanagevehicle', 'Manage Vehicle', 'E') != null) ? FLEET_SERVER_URL + 'images/edit2.png' : '',
     tooltip: fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_EDIT_'),
     scope: this,

     handler: function(grid, rowIndex, colIndex) {

         //var data = Vehiclestore.data.items[rowIndex].data;
         var rec = grid.getStore().getAt(rowIndex);
         console.log(rec);
         if (fleet.rolerightscreate.modulerights('Editmanagevehicle', 'Manage Vehicle', 'E') != null) {
             this.fireEvent("ShowVehicleDetails", rec);
         }
     }
 }, {
     xtype: 'spacer'
 }, {
     icon: (Ext.getStore('userStore').first().get('issuperadmin') == 1 ? FLEET_SERVER_URL + 'images/del.png' : ''),
     //(fleet.rolerightscreate.modulerights('Deletemanagevehicle', 'Manage Vehicle', 'D') != null) ? FLEET_SERVER_URL + 'images/del.png' : '',  // Use a URL in the icon config  

     tooltip: fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_DELETE_'),
     handler: function(grid, rowIndex, colIndex) {
         var rec = grid.getStore().getAt(rowIndex);
         if (fleet.rolerightscreate.modulerights('Deletemanagevehicle', 'Manage Vehicle', 'D') != null) {
             Ext.Msg.show({
                 title: fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_REMOVETITLE_'),
                 msg: fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_REMOVEMSG_'),
                 buttons: Ext.Msg.YESNO,
                 icon: Ext.Msg.QUESTION,
                 callback: function(button) {
                     if (button == fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_YESBTN_')) {
                         me.removeVehicle(rec);
                     }
                 }
             });
         }
     }
 }]
}

在上面的代码中，操作列包含3项，编辑、空格（即{xtype:'spacer'}）、和删除图标。我想根据条件隐藏删除图标。表示仅在管理员用户登录时显示的删除选项。 请看看这个设计，你们可以更好地了解这个问题

使用下面的代码，我可以隐藏删除图标，但工具提示和单击事件仍然会在单击隐藏图标位置时触发

icon: (Ext.getStore('userStore').first().get('issuperadmin') == 1 ? FLEET_SERVER_URL + 'images/del.png' : ''),

---

您可以在同一对象中使用

getClass

方法

handler: function(grid, rowindex, cellIndex, a, e, record, tr) {
    if (condition)
       {
        //some logic
       }
    },
getTip: function(v, meta, rec) {
     if (condition) {
         return '';
     } else {
         return 'ToolTip';
     }
    }
getClass: function(v, meta, rec) {
   if (condition) {
                return '';
        } else {
                return 'co-delete-ico';
        }
 }

---

希望这有助于

而不是隐藏使用isDisabled（）方法

要工作，该方法必须位于actioncolumn本身中

    isDisabled: function (grid, rowIndex, colIndex, items, record) {
        if (condition) {
             return true;
        } else {
            return false;
        }
    }

---

小提琴：

我想也许你想躲起来。

注：未经测试

{
xtype:'actioncolumn'，
弹性：1，
可排序：false，
menuDisabled：没错，
对齐：'居中'，
项目：[{
//添加所需的渲染方法类型
隐藏模式：“显示”，
//在这里检查权限吗
hide:fleet.rolerightscreate.modulerights（'Editmanagevehicle'，'managevehicle'，'E'）！=null）？true:false，
图标：（fleet.rolerightscreate.modulerights（'Editmanagevehicle'，'managevehicle'，'E'）！=null）？fleet\u服务器\u URL+'images/edit2.png'：''，
工具提示：fleet.Language.get（“\u fleet\u VEHICLE\u VEHICLELIST\u EDIT”），
范围:本,，
处理程序：函数（网格、行索引、colIndex）{
//var data=Vehiclestore.data.items[rowIndex].data；
var rec=grid.getStore（）.getAt（行索引）；
控制台日志（rec）；
if（fleet.rolerightscreate.modulerights（'Editmanagevehicle'，'ManageVehicle'，'E'）！=null）{
这是fireEvent（“ShowVehicleDetails”，rec）；
}
}
}

我不认为隐藏或禁用图标是这里的解决方案。如果用户不是管理员，为什么还要添加图标。我会

构建ActionColumnItems

方法，该方法将根据当前用户的角色返回action列的项

操作列配置：

{
    xtype: 'actioncolumn',
    flex: 1,
    sortable: false,
    menuDisabled: true,
    align: 'center',
    items: this.buildActionColumnItems()
}

buildActionColumnItems

方法实现：

buildActionColumnItems: function () {
    //set the implicit items
    var columnItems = [{
        icon: (fleet.rolerightscreate.modulerights('Editmanagevehicle', 'Manage Vehicle', 'E') != null) ? FLEET_SERVER_URL + 'images/edit2.png' : '',
        tooltip: fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_EDIT_'),
        ...
    }];

    //add aditional items if the user is super admin
    if (Ext.getStore('userStore').first().get('issuperadmin') == 1) {
        columnItems.push({
            xtype: 'spacer'
        });
        columnItems.push({
            icon: FLEET_SERVER_URL + 'images/del.png',
            tooltip: fleet.Language.get('_FLEET_VEHICLE_VEHICLELIST_DELETE_'),
            ...
        });
    }

    return columnItems;
}

---

我使用了以下代码：-->图标：（Ext.getStore（'userStore'）.first（）.get（'issueadmin'）==1？FLEET\u SERVER\u URL+'images/del.png'：“”），但这只会得到隐藏“删除”图标，当我看到图标的位置时，我会看到工具提示，当我单击该位置时，会看到删除窗口弹出窗口。我已经更新了答案，在句柄功能中，您还必须检查您的条件，然后它将不会打开删除弹出窗口。