ExtJS 4:如何配置商店以加载特定ID集的模型？

Question

例如,假设我有一个服务器API用于加载处理这样的请求的人:GET/people /？id = 101,329,27

我想构建一个Store(可能是一个扩展Ext.data.Store的自定义类) - 假设它有一个人员ID列表 - 导致代理发出如上所示的请求,以便返回数据仅适用于该子集.

我看到了有关远程过滤的文档,但我担心的是使用它我首先需要调用store.load()来加载所有人,然后调用filter()来进行远程过滤.我想第一次加载人员子集.

谢谢你的建议!

Answer 1

找到了解决方案(尽管仍然可以听到其他想法).

首先,您可以使用将传递给操作的配置对象调用商店的load()函数.Ext.data.Operation的API文档清楚地表明其中一个配置选项适用于Filter对象数组,因此您可以这样做:

var idFilter = Ext.create('Ext.util.Filter', {
  property: 'id',
  value: '100,200,300'
});

myStore.load({
  filters: [ idFilter ]
});

这会导致URL查询字符串包含的请求?filter=[{"property"%3Aid%2C"value"%3A100,200,300}](换句话说,URL编码版本[{ property: 'id', value: '100,200,300'}]).

您也可以在myStore.filter('id', '100,200,300')没有.load()先呼叫的情况下拨打电话.假设您的商店中有remoteFilter = true,这将使请求显示相同的查询参数.

旁注:您可以通过为代理配置'filterParam'配置选项来更改用于'过滤器'的关键字.例如,如果filterParam = q,则上面显示的查询字符串将更改为:?q=[{"property"%3Aid%2C"value"%3A100,200,300}]

其次,您可以在查询字符串中控制过滤器的"结构".就我而言,我不想要像filter = {JSON}这样的东西,如上所示.我想要一个看起来像这样的查询字符串:?id=100,200,300 为此我需要扩展代理并覆盖默认的getParams()函数:

Ext.define('myapp.MyRestProxy', {
    extend: 'Ext.data.proxy.Rest',

    /**
     * Override the default getParams() function inherited from Ext.data.proxy.Server.
     *
     * Note that the object returned by this function will eventually be used by
     * Ext.data.Connection.setOptions() to include these parameters via URL
     * querystring (if the request is GET) or via HTTP POST body. In either case,
     * the object will be converted into one, big, URL-encoded querystring in
     * Ext.data.Connection.setOptions() by a call to Ext.Object.toQueryString.
     * 
     * @param {Ext.data.Operation} operation
     * @return {Object}
     *  where keys are request parameter names mapped to values
     */
    getParams: function(operation) {
        // First call our parent's getParams() function to get a default array
        // of parameters (for more info see http://bit.ly/vq4OOl).
        var paramsArr = this.callParent(arguments),
            paramName,
            length;

        // If the operation has filters, we'll customize the params array before
        // returning it.
        if( operation.filters ) {
            // Delete whatever filter param the parent getParams() function made
            // so that it won't show up in the request querystring.
            delete paramsArr[this.filterParam];

            // Iterate over array of Ext.util.Filter instances and add each
            // filter name/value pair to the array of request params.
            for (var i = 0; i < operation.filters.length; i++) {
                queryParamName = operation.filters[i].property;

                // If one of the query parameter names (from the filter) conflicts
                // with an existing parameter name set by the default getParams()
                // function, throw an error; this is unacceptable and could cause
                // problems that would be hard to debug, otherwise.
                if( paramsArr[ queryParamName ] ) {
                    throw new Error('The operation already has a parameter named "'+paramName+'"');
                }

                paramsArr[ queryParamName ] = operation.filters[i].value;
            }
        }

        return paramsArr;
    }
});