Question

我在ViewModel中有一个商店，如：

   <network>
        <cluster-members>
            <address>127.0.0.1:57xx</address>
        </cluster-members>
    </network>

和网格一样：

Ext.define('MyApp.page.PageModel', {
    extend: 'Ext.app.ViewModel',
    //...

    stores: {
        Posts: {
            model: //...
        }
    }
});

如何在商店加载后更改网格视图（在我的情况下）？

我尝试在网格事件中使用Ext.define('MyApp.page.MainView', { extend: 'Ext.panel.Panel', //... initComponent: function () { var me = this; //... me.items = [ { xtype: 'grid', bind: { store: '{Posts}' }, columns: [ /* ... */ ], viewConfig: { getRowClass: function (record) { //... } } } ]; me.callParent(arguments); } });和mon方法（addManagedListener和beforerender），我尝试使用viewready和{{1}存储在这些网格事件中的方法，但此解决方案无效。

有人有任何想法吗？

Answer 1

在ExtJS 6中，网格上有一个函数setEmptyText可以为您执行此操作：

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

    me.callParent(arguments);
    me.getStore().on('load', function() {
        me.setEmptyText(...);
    })
}

在ExtJS 5中，您必须自己动手：

    me.getStore().on('load', function() {
       var emptyText = 'Test empty text';
       me.getView().emptyText = '<div class="' + me.emptyCls + '">' + emptyText + '</div>';
       me.getView().refresh();
    })

Relevant fiddle，将在渲染后3秒加载其商店。

Answer 2

我正在使用Ext.view.AbstractView的覆盖，只是为了在存储加载事件之前清除emptyEl和viewEl

store.on('beforeload', function() {
    me.clearEmptyEl();
    me.clearViewEl();
});

这是我的完整覆盖

Ext.define('Ext.overrides.view.AbstractView', {
    override: 'Ext.view.AbstractView',

    onBindStore: function(store, initial, propName) {
        var me = this;

        me.setMaskBind(store);
        // After the oldStore (.store) has been unbound/bound,
        // do the same for the old data source (.dataSource).
        if (!initial && propName === 'store') {
            // Block any refresh, since this means we're binding the store, which will kick off
            // a refresh.
            me.preventRefresh = true;
            // Ensure we have the this.store reference set correctly.
            me.store = store;
            me.bindStore(store, false, 'dataSource');
            me.preventRefresh = false;
        }
        store.on('beforeload', function() {
            me.clearEmptyEl();
            me.clearViewEl();
        });
    }
});

ExtJS 5.x如何在存储加载后更改网格视图（viewConfig）？

2 个答案: