打开包含 ExtJS 网格的浏览器弹出窗口 window 的最佳方式

Best way to open browser popup window containing ExtJS grid

在我们的 ExtJS 应用程序中,我们有一些菜单和一个选项卡面板。单击 menuItem 打开一个网格。

我们有一个要求,用户可以在两种模式中的任何一种模式下打开包含网格的显示:

  1. 内联 - 网格将作为 tabpanel 中的选项卡项打开。
  2. 弹出窗口 - 使用 window.open 打开新浏览器 window 和整个 首先加载 ExtJS 库,然后加载网格。 Popup as browserwindow方便多显示器.

所以这里的问题是每当我们打开一个弹出窗口时 window 需要 ExtJS 库,它在 IE 中占用了大量内存。

有没有其他方法可以在不加载整个 ExtJS 框架的情况下使用 ExtJS 网格加载浏览器 window 弹出窗口?

或者任何其他想法都是最受欢迎的,因为我们在 IE 中确实面临很多内存问题,用户不愿意使用 chrome。

提前致谢。

如果不首先在新的 window 中加载 Ext 框架(或至少是网格所需的部分),则无法将网格加载到新的 window 中。您无法访问父 window 的 ExtJS 框架的副本并使用它,因为 ExtJS 要求组件位于同一 window 中才能正常工作。部分原因是浏览器安全性禁止在 windows 之间复制或共享某些结构,部分原因是 ExtJS 架构。

关于浏览器安全性,当您仅复制网格内容时甚至可能会导致问题。确保测试所有不同的浏览器。在 windows 之间复制数据可能需要您序列化和反序列化才能在所有浏览器中工作。例如,我无法在浏览器 window 和 Chrome 中的 iframe 之间复制简单的 javascript 日期,它们出现了 null。我不得不序列化记录,传输它们,然后再次反序列化它们:

var serializedRecords = dataStore.getRange().map(function(record) { 
    return record.getData({serialize:true, persist:true}); // <- serialization required
});
iframe.contentWindow.Ext.getStore("DataStore").
    loadRawData(serializedRecords); // <- loadRawData deserializes records
},

执行如何

var popupWin = window.open('...');
popupWin.Ext = window.Ext;

并且不在子 window

中加载 ExtJs

有一个叫做 Sencha CMD 的工具。 它可以只构建被定义为依赖项的 Ext js 部分(组件定义中的 require 部分)。因此,Ext JS 附带的所有其他组件都将被忽略。 您必须下载 ext js 源并了解如何使用该工具

http://docs.sencha.com/cmd/