在 ExtJS 4.2 中更新和重新渲染组件

Question

有没有办法在标签切换时重新渲染组件？我有这个数据加载它的所有商店，其中包含特定的权限。每个选项卡只能包含为其视图提供的内容。请参阅下面的屏幕截图：

基本上，这会加载到initComponent。我目前遇到的困境是 Backoffice 选项卡与 Wombat 选项卡具有不同的权限。这个想法是当它们中的任何一个包含一个权限时，比如一个编辑权限 (sCreate)，只有该角色被允许显示所见的编辑按钮。所以后台有sEcommCreate，而Wombat 有sCreate。当其中任何一个满足为真时，它只需将其添加/推送到要在initComponent 期间显示的列。

if (EcommBackoffice.plugin.Security.getAccess(oMe.sCreatePermission)) {
  aColumns.push({
    header: 'Action',
    xtype: 'actioncolumn',
    itemId: 'edit-role-btn',
    width: 100,
    sortable: false,
    resizable: false,
    draggable: false,
    menuDisabled: true,
    items: [{
      icon: 'resources/img/editpermissions.png',
      tooltip: 'Edit Permissions',
      scope: oMe
    }],
    editor: {
      xtype: 'text',
      name: 'editRow',
      cls: 'banks-delete-row'
    }
  });

}

如何在打开另一个选项卡以及加载时过滤掉显示？目前，一旦sCreate 或sEcommCreate 通过了它的条件，它只会在两个角色上添加按钮，因为这是一个store。

已经尝试从控制器重新加载数据存储，但它 只加载数据，而不是重新渲染组件 添加/删除/显示/隐藏它们。

为了更清楚，如果Action 列没有分配给它的创建权限，我需要隐藏/删除它。

Answer 1

actioncolumn 和所有操作列项都有一个函数isDisabled。我建议使用该功能来启用/禁用该项目，例如

items: [{
  icon: 'resources/img/editpermissions.png',
  tooltip: 'Edit Permissions',
  isDisabled:function() {
      var isWombatTab = (this.up('tabpanel').getActiveTab().text == 'Wombat');
      if(isWombatTab) return EcommBackoffice.plugin.Security.getAccess(oMe.sCreatePermission)
      else return EcommBackoffice.plugin.Security.getAccess(oMe.sEcommCreatePermission)
  },
  scope: oMe
}],

isDisabled() 将在网格刷新期间处理，因此每当您重新加载存储时，更改都应该生效。要在不更改存储的情况下强制刷新，您当然可以从标签的activate 事件中调用grid.refresh()。

然后应该可以通过 CSS 隐藏禁用的项目。我不知道具体需要什么（也可能取决于您使用的主题），但第一个猜测是

.x-grid-cell-edit-role-btn .x-item-disabled {
  visibility:hidden;
}