ExtJS 6 网格无法正确更新/刷新列标题答案

【问题标题】：ExtJS 6 grid doesn't update/refresh column headers properlyExtJS 6 网格无法正确更新/刷新列标题
【发布时间】：2016-02-10 14:12:55
【问题描述】：

我有一个基本的 ExtJS 网格面板，我可以在上面动态应用自定义状态。使用另一个控件（例如组合框或另一个网格），我的应用程序在网格上应用选定的状态。这种状态的一个例子：

{
"height": 384,
"columns": [{
    "id": "h107"
},
{
    "id": "h1",
    "width": 30
},
{
    "id": "unplannedtasks_ActualEndDate",
    "hidden": true,
    "width": 100
},
{
    "id": "unplannedtasks_ActualNoResources",
    "hidden": true,
    "width": 100
},
{
    "id": "unplannedtasks_ActualResponseDateTime",
    "hidden": true
},
{
    "id": "unplannedtasks_ActualTotalDurationInSeconds",
    "width": 100
},  
"filters": []
}

这是网格声明的相应列部分：

Ext.define('Ext.grid.Stateful', {
  extend: 'Ext.grid.Panel',  
  stateEvents: ['columnmove', 'columnresize', 'sortchange', 'hiddenchange', 'groupchange', 'show', 'hide'],
  // CODE OMMITTED FOR BREVITY
 initComponent: function () {
    Ext.apply(this, {
       columns: [
             filterAction,
             new columns.tasks.ActualEndDate({ id: 'unplannedtasks_ActualEndDate', hidden: false }),
             new columns.tasks.ActualNoResources({ id: 'unplannedtasks_ActualResponseDateTime', hidden: false },
             new columns.tasks.ActualResponseDateTime({ id: 'unplannedtasks_ActualResponseDateTime', hidden: false },
             new columns.tasks.ActualTotalDurationInSeconds({ id: 'unplannedtasks_ActualTotalDurationInSeconds', hidden: false }
         ]
   });
 }

})

列定义示例：

 Ext.define("columns.tasks.ActualNoResources", {
  extend: "Ext.grid.column.Column",
  text: 'ActualNoResources',   
  dataIndex: 'ActualNoResources',  
  editor: {
    allowBlank: false
  }, filterable: true,
  filter: {
    type: 'string'
  }
});

一切都按我的预期进行，除了列标题似乎没有正确刷新。如果我在网格中打开列面板，它会显示正确数量的可见和隐藏列。过滤器的情况相同：如果状态中有过滤器，它将在正确的字段上应用正确的值。好像列标题需要以某种方式刷新。

我尝试使用 grid.getView().refresh() 但这不起作用。相反，如果我调整网格的大小，它会刷新隐藏的列，但不会刷新最初隐藏但现在可见的列。

我认为我缺少属于网格的 applyState 方法的简单代码行，因此我可以命令网格以新状态而不是先前或初始状态刷新网格。

关于如何解决这个问题的任何想法？

【问题讨论】：

在您的第二个代码 sn-p （带有列数组）中，这是如何定义的？它是使用 Ext.define 还是在创建网格实例时配置列？另外，“似乎没有正确刷新”是什么意思？
我更新了第二个代码sn-p。它是网格定义的一部分，通过使用 Ext.define 确实。我在 initComponent 函数中应用列。关于刷新问题，网格中的所有设置都假设一切正常：应用过滤器，在网格菜单中勾选右列。只是状态在列标题中不可见（例如，状态中的隐藏字段在网格中仍然可见）。如果我手动调整网格大小，则会触发一些触发器来刷新网格，从而导致网格正确显示。

标签： javascript jquery extjs state extjs6

【解决方案1】：

事实证明，ExtJS 无法实现我所追求的场景。我要问的只能在启动期间完成（无需开发人员的自定义代码干预），所以我不得不退出这种方法并提供自定义代码。最后，我不得不重建列，然后将该集合传递给网格的 reconfigure(store, columns) 方法。

【讨论】：