javascript - 如何在 beforeload 事件中获取 Extjs 4 商店的请求数据？

Question

我正在尝试在商店中获取请求数据参数 beforeload 事件。我可以看到操作对象包含请求数据，但我似乎无法从操作对象中获取它

Ext.create('Ext.data.Store', {
    autoLoad : true,
    fields   : [
        {name: 'item_code',             type: 'string'},
        {name: 'quantity',              type: 'int'},
        {name: 'description',           type: 'string'}
    ],
    storeId  : 'summary',
    proxy    : {
        type            : 'ajax',
        actionMethods   : 'POST',
        extraParams     : {'filter': 'branch', 'branch': location },        
        url             : 'reports/stock_summary',
        reader: {
            type    : 'json',
            root    : 'data'
        }
    },
    listeners: {
        beforeload: function(store, operation, options){
            console.log( operation )
        }
    }
});

知道如何在加载事件之前获取请求对象并获取该请求对象内的数据吗？

Answer 1

代理发出请求并拥有所有相关的请求数据。您可以覆盖 Ext Ajax 代理的 doRequest 方法。正确的方法是创建一个新的自定义代理，但为简洁起见，您的示例已更新以覆盖代理中的 doRequest。然后，您可以触发一个事件，将您想要的数据传递给绑定到新事件的任何内容，或者您​​可以将您的逻辑内联编写到 console.log 当前所在的位置，如本示例所编码的那样。

    Ext.create('Ext.data.Store', {
        autoLoad : true,
        fields   : [
            {name: 'item_code',             type: 'string'},
            {name: 'quantity',              type: 'int'},
            {name: 'description',           type: 'string'}
        ],
        storeId  : 'summary',
        proxy    : {
            type            : 'ajax',
            actionMethods   : 'POST',
            extraParams     : {'filter': 'branch', 'branch': location },        
            url             : 'reports/stock_summary',
            reader: {
                type    : 'json',
                root    : 'data'
            },
            /*
            * override Ext Ajax Proxy doRequest method
            * must be maintained when Ext library is updated in the app
            */
            doRequest: function(operation, callback, scope) {
                var writer  = this.getWriter(),
                    request = this.buildRequest(operation, callback, scope);

                if (operation.allowWrite()) {
                    request = writer.write(request);
                }

                Ext.apply(request, {
                    headers       : this.headers,
                    timeout       : this.timeout,
                    scope         : this,
                    callback      : this.createRequestCallback(request, operation, callback, scope),
                    method        : this.getMethod(request),
                    disableCaching: false // explicitly set it to false, ServerProxy handles caching
                });

                /*
                * do anything needed with the request object
                */
                console.log('request', request);
                console.log('request.params', request.params);

                Ext.Ajax.request(request);

                return request;
            }
        }});

Answer 2

如何尝试 operation.request.params

我想这可以帮助你...

var test = Ext.create('Ext.data.Store', {
        autoLoad : true,
        fields   : [
            {name: 'item_code',             type: 'string'},
            {name: 'quantity',              type: 'int'},
            {name: 'description',           type: 'string'}
        ],
        storeId  : 'summary',
        proxy    : {
            type            : 'ajax',
            actionMethods   : 'POST',
            extraParams     : {'filter': 'branch', 'branch': location },        
            url             : 'reports/stock_summary',
            reader: {
                type    : 'json',
                root    : 'data'
            }
        },
        listeners: {
            beforeload: function(store, operation, options){
                console.log( 'manual load ' + operation.params );
                console.log( operation.params );
                console.log( 'proxy defined params ' + store.proxy.extraParams );
                console.log( store.proxy.extraParams )
            }
        }
    });

    test.load({params: {test: '123'}});

Answer 3

不能代表 extjs4，但在先前项目的 extjs3 中，我不得不抑制和覆盖 ext..

(function(){
  var originalFn = path.to.functionNAme
  path.to.functionName = function(...) {
    //frob data here
    originalFn(...);
  }
})

不是最好的答案，因为我没有那个代码库，大约 2 年前在另一份工作。