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

【问题标题】：how to get Extjs 4 store's request data on beforeload event?如何在 beforeload 事件中获取 Extjs 4 商店的请求数据？
【发布时间】：2011-09-20 22:44:24
【问题描述】：

我正在尝试在商店中获取请求数据参数 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 )
        }
    }
});

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

【问题讨论】：

标签： javascript extjs extjs4 extjs-mvc

【解决方案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;
            }
        }});

【讨论】：

非常感谢您的回答，非常有用。
嗨约翰赖斯我试过你的代码，但我得到这个错误类型错误：表达式'a'[未定义]的结果不是一个对象。在文件：///android_asset/www/touch/sencha-touch.js:6
嗨 ekjyot，尝试使用 sencha-touch-all-debug.js 而不是 osencha-touch.js 来获得更好的错误消息。这可能会以不同的方式工作，并且您将通过使用调试脚本获得的额外错误信息将有助于缩小问题的根源。
@JohnRice：谢谢！这确实有帮助。我一直在寻找这个答案一个多小时。尝试通过商店的“beforeload”事件发送参数时，我运气不定（我可以发送“id”键的值，但不能发送其他值）。原来我需要通过extraParams 发送键值对。现在一切都是金色的。再次感谢！

【解决方案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'}});

【讨论】：

在 4.1 中，操作对象上的参数数据直到 beforeload 事件之后才定义，但您可以在商店中创建对它的引用，然后在 load 中读取 operation.params定义时的事件。
ExtJS 6.2 现在是_params

【解决方案3】：

不能代表 extjs4，但在之前的项目中，在 extjs3 中，我不得不抑制和覆盖 ext..中的一个函数。

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

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

【讨论】：