javascript - 引用页面上 ExtJS 组件的所有实例

Question

我创建了几个可重用的 ExtJS 组件，类似于以下内容:

MyCustomGridPanel = Ext.extend(Ext.form.GridPanel, {
    constructor: function(config) {
        config = Ext.apply({
            // some other default options
        }, config);

        MyCustomFormPanel.superclass.constructor.call(this, config);
    }
});

然后，我可以在需要的页面中包含此自定义网格面板。在某些情况下，我会在页面上多次出现相同的网格面板。

我试图解决的问题是我有表单面板，我想自动更新任何包含与自动刷新的表单面板相关的数据的网格面板。

如果页面上只有一个网格面板，在成功提交表单面板后，我可以调用 Ext.getCmp('the_id_of_the_grid_panel').getStore().reload() 。但对于这些网格面板的多个实例，我想做类似的事情，但不使用 ID，因为 ID 必须是唯一的。我想获取页面上所有网格面板的数组，并带有某种标识符并调用 <item>.getStore().reload() .

我的 Google 搜索和 Stack Overflow 搜索能力失败了，我似乎找不到任何东西来找到我想要的东西。

Answer 1

我们必须在我们的项目中做类似的事情。我们需要网格来相互通信。当一个网格中的数据更新时，可能需要另一个网格来更新自身。我们通过在 extjs 应用程序中使用中介者模式来做到这一点。我们将正在编辑的网格注册为特定事件的发送者，在本例中为编辑事件。然后，当添加新行时，中介器会发送一条消息，并且正在监听该事件(编辑事件)的任何其他网格都会接收消息/事件并刷新自身。

您可以按照自己的意愿创建调解者。这是一个起点:

http://www.fancybread.com/blog/post.cfm/mediator-pattern-applied-to-javascript