Question

我正在使用extjs designer 1.2。我在面板上有一个按钮，可以在点击时打开窗口。窗口有网格，我在js文件中应用了渲染器。问题是渲染器在第一次打开窗口时效果很好，但是当我关闭窗口时重新打开它，效果就会消失。

Ext.define('MyApp.view.TestWindow', {
    extend: 'MyApp.view.ui.TestWindow',

initComponent: function() {
    var me = this;
    me.callParent(arguments);

}

 });

=============================================== ===========================

Ext.define('MyApp.view.TestPanel', {
    extend: 'MyApp.view.ui.TestPanel',

initComponent: function() {
    var me = this;
    me.callParent(arguments);
    Ext.data.StoreManager.lookup('Test').load();
    me.down('button[id=testbutton]').on('click',me.onTestBtnClick,me); 
},

onTestBtnClick:  function(){

    var win = new Ext.create('MyApp.view.TestWindow');
    win.show();
    win.down('#testgrid').columns[0].renderer=function(val){
         return '<span style="color:red;">' + val + '</span>';
        }

}
});

观察：当我在ui.js中使用渲染器，即通过从设计师导出项目生成的文件时，我不会遇到上述问题。什么可以解决这个问题？

Answer 1

我已解决由我的closeAction Ext.Window <{em>} 设置为MyApp.view.TestWindow的{{1}}配置选项导致的类似问题}，而不是hide （Ext JS 4默认）。您说明的按钮单击事件处理程序会在每次触发时实例化一个新的destroy （在您的情况下为Ext.Window）。如果未正确创建和销毁这些实例，您可能会遇到DOM MyApp.view.TestWindow争用和不良结果。

如果你的目标是坚持这样的实例更好的方法，无论当前配置选项的状态如何，你都可以将实例化逻辑重新定位到全局范围，只管理ID和{ {1}在按钮单击事件处理程序中{1}}。

因为您没有提供基础show逻辑，所以我只能假设您的问题的根本原因与错误配置的配置选项和/或组件实例管理的组合有关，最终导致组件争用同一个DOM hide。

另一件需要注意的事情是使用静态定义的MyApp.view.TestWindow配置选项。如果要在任何组件上静态定义ID配置选项，则必须确保这些组件是单例，或者在全局范围内分配它们的实例以供重用。同样，这一切都归结为适当的组件管理。

最后，使用我的建议也不会泄露任何特定于您id的明显问题。如果是这种情况，请检查并确保没有任何基础id子组件（网格，列模型，列等）是罪魁祸首。

修改

以下是一个例子：

MyApp.view.TestWindow

extjs 4设计师1.2网格渲染器

1 个答案: