Question

我有一个自定义数据存储，用于存储商店是否已加载一次的信息。

/**
 * Custom DataStore which stores the information whether data has been loaded once or not.
 */
Ext.example.Store = Ext.extend(Ext.data.Store, {
    loaded: false,
    initComponent: function() {
        this.superclass().initComponent.call(this);
        this.addEvents('load','beforeload');
    },
    isLoaded : function() {
        return this.loaded;
    },
    listeners: {
        'load' :  function(store,records,options) {
            this.loaded = true;
        }
    }
});

这个工作正常，直到最近我向这个商店的一个实例添加了一个'beforeload'事件监听器。现在不会调用'load'监听器。

var accountsDataStore = new Ext.example.Store({

    id : 'account',
    proxy : new Ext.data.HttpProxy({
        url : 'app/account/fetch/all',
        method : 'post',
        api : {
            destroy : 'app/account/delete'
        }
    }),
    reader : accountReader,
    writer : accountWriter,
    remoteSort : true,
    sortInfo : {
        field : 'createdOn',
        direction : "DESC"
    },
    listeners: {
        beforeload: function(store, options) {
            var sort = options.params.sort;
            // setting the sort parameters to match the property names in the DTO
            switch(sort) {
                case 'company' :
                    options.params.sort = 'company.name';
                    break;
                default:
                    // do nothing
            }
        }
    }

});

我在这里做错了什么？另外，请告诉我您的改进建议

Answer 1

问题是你永远不应该在原型上设置对象，除非你真的知道它意味着什么（它将被所有实例共享，并且可以基于每个实例被覆盖）

在Ext JS中，我只在原型上设置配置选项，这只是为了方便，可能会被调用者覆盖。

你的第一堂课Ext.example.Store会把听众放在原型上。然后，通过将侦听器对象传入配置，然后在accountsDataStore中覆盖它。

要解决您的问题，而不是在原型上设置侦听器，只需从构造函数中调用this.on('event')。

/**
 * Custom DataStore which stores the information whether data has been loaded once or not.
 */

Ext.example.Store = Ext.extend(Ext.data.Store, {
    loaded: false,
    constructor: function() {
        this.superclass().constructor.call(this);
        // No need to call this, you're not adding any events
        // this.addEvents('load','beforeload');
        this.on('load', function(store,records,options) {
            this.loaded = true;
        }, this);
    },
    isLoaded : function() {
        return this.loaded;
    }
});

Answer 2

“beforeload”事件的文档说明：

“在请求新数据对象之前触发。如果是 beforeload handler返回false，加载操作将被取消。“

您可以尝试从beforeload侦听器返回true，以确保加载操作仍然运行。

Answer 3

store.totalCount

如果已加载，则此属性返回一个数字其他这个属性是未定义的（ExtJS的-4.1.0-RC1）

Answer 4

好的，我认为范围有问题。请这样试试：

listeners: {
        'load' :  {
            fn : function(store,records,options) {
                 console.log(this, this.loaded);
                 this.loaded = true;
            },
            scope : this
        }
    }

或者您可以使用：

listeners: {
        'load' :  function(store,records,options) {
            store.loaded = true;
        }
    }

ExtJS Store加载侦听器未被调用

4 个答案: