javascript - ExtJS。在渲染时加载商店

Question

从此thread似乎非常过时了，让我问一个类似的问题。所以，我有一个像这样定义的 store:

Ext.define('GeoServer.store.ObjectsStore', {
    extend: 'Ext.data.TreeStore',
    requires: ['GeoServer.model.ObjectsModel'],
    model: 'GeoServer.model.ObjectsModel',
    autoLoad: false,
    proxy: {
        type: 'ajax',
        url: 'controller/MapsHandler.php',
        extraParams: {
            action: 'listObjects'
        }
    }
});

如您所见，它的 autoLoad 设置为 false。这是因为我不想在页面加载时加载数十个商店，我只想在需要时加载它们。例如，在本例中，当我显示一个内部带有 treepanel 的窗口时，我需要加载此商店。我显示此窗口的方式是:

Ext.create("Ext.window.Window",{ 
    title: "Objects",
    height: size.height,
    width: size.width,
    constrainHeader:true,
    layout:"fit",
    maximizable:true,
    items:[{
        xtype: 'treepanel',
        rootVisible: false,
        scrollable: true,
        itemId: 'Objects',
        store: 'ObjectsStore',
        border: false,
        autoLoad: true // has no effect
    }]
}).show();

但令人讨厌的是，当窗口第一次显示时，即使我看到服务器请求被触发，树也不会填充数据。但是，当窗口第二次、第三次等出现时，一切正常。那么，第一次有什么特别之处以及如何以正确的方式使用这个 autoLoad 属性？

Answer 1

如果您希望商店在应用程序启动时加载，则需要在商店上设置 autoload true。

您有两个机会，显示商店负载窗口:

    var store=Ext.getStore('ObjectsStore'),
         view=this.getView();
     view.mask('loading');
     store.on('load',function(){
         view.unmask();
         YourWindow.show();
     });
     store.load();

或者您可以尝试在渲染监听器之前加载存储:

listeners:{
   beforerender: function(){
      Ext.getStore('ObjectsStore').load();
   }
}

在我看来，最好的解决方案是第一个，Store 执行异步加载，因此您总是会看到树面板填充在他的负载上