Extjs4如何构造store基类

　　目标：重写一个BaseStore的基类，它继承自Ext.data.Store基类。　　autoLoad:true/false　　是否自动加载，true时创建store即自动加载，一般适合get方式；false时一般需要通过触发事件给store赋参数，然后load()，一般适合post请求方式。

　　remoteSort:true/false　　是否远程服务器排序，默认false，即在客户端排序。

　　sortOnLoad:true/false　　默认true，所有加在store上的排序操作都在数据加载完之后，改变数据的事件触发之前进行，如果remoteSort为true，则会忽略该字段功能。

　　pageSize:number　　默认25，每页加载多少行数据，可用于nextPage和previousPage方法实现分页功能。

　　model:string　　store对应的model，一般必填，最重要的参数。

　　fields:object　　如果没有model，则可以直接给fields赋值，会根据fields自动创建对应的model。

　　proxy:数据代理方式　　proxy基类又有很多参数和属性，以type:'Ajax'为例：

(1) batchActions:true/false　　是否设置启用批量操作，默认为true。批量操作就是对Store实例中的记录作CUD（create、update、destroy）后，执行“store实例.sync()”批量将操作发送到服务端。

(2) batchOrder: 以逗号作分隔符的方式设置批量操作的顺序，默认为"create,update,destroy"。仅batchActions为true时有效。

(3) reader: 读取服务器端数据的方式，常用'json'方式，与之对应的是writer:从客户端向服务器端发送数据时的数据形式，常用'json'。

(4) actionMethods: http请求方式，get一般read操作，post一般create、update、destroy操作。

(5) api:增删改查对应的后台路径。

(6) extraParams:object　　前台往后台发送请求时需要的参数：比如：

param:{date:myDate,
time:myTime,
num:myNum
}
myStore.extraParams=param;这样就可以把参数发送给后台了。

(5) Ext.data.reader.Json很常用，很重要，它的重要参数和属性：

idProperty：从数据源读取的记录的id属性名，默认与Model的idProperty一致；
messageProperty：从数据源读取的数据的message属性名，默认为message；
root：从数据源读取的数据的记录入口属性名，默认为空字符串；
successProperty：从数据源读取的数据的success属性名，默认为success；其值为true则表示成功，为false且存在errors属性则表示服务端失败，为false且无errors属性则表示链接失败。
totalProperty：从数据源读取的数据的total属性名，默认为total；表示总记录数目。

(6) Ext.data.writer.Json　参数和属性：

　　1. allowSingle:true/false　　默认true，只有一组数据时不用数组形式，false时都用数组形式。

　　2. writeAllFields：设置为true时将记录的所有字段均发送到数据源（客户端或服务端）；false时则仅发送标记为modified(修改过的)的字段到数据源。默认值为true。注意被标记为persist为false的字段将不发送到数据源。

以上就是和store基类有关的经常用到的属性和参数，自己可以根据这些属性构造适合自己的基类。

Ext.define('MyExt.store.Base.BaseStore', {
    extend: 'Ext.data.Store',
    requires: ['MyExt.store.JsonReader'],
    autoLoad: true,
    remoteSort: false,
    sortOnLoad: false,
    pageSize: 50,
    model: '',          //必填属性 model
    readAction: 'get',  //请求读取时的方式post、get
    batchActions: true,
    constructor: function (config) {
        Ext.apply(this, config);
        var me = this;
        var model = Ext.create(me.model, {});
        var multiidProperty = false;
        if (typeof (model.idProperty) != 'string') {
            multiidProperty = true;
        }
        me.proxy = {
            type: "ajax",
            api: model.api,
            reader: Ext.create('MyExt.store.JsonReader', {
                idProperty: model.idProperty
            }),
            writer: {
                type: 'json',
                writeAllFields: multiidProperty,
                allowSingle: false
            },
            actionMethods: {
                read: me.readAction
            },
            batchActions: me.batchActions,
            method: 'post'
        };
        this.callParent([config]);
        return this;
    },
    setParam: function (obj) {
        Ext.apply(this.proxy.extraParams, obj);
        if (this.pageSize != -1) this.currentPage = 1;
    }  
});

Ext.define('MyExt.store.JsonReader', {
    extend: 'Ext.data.reader.Json',
    type: 'json',
    root: 'data',
    totalProperty: 'count',
    successProperty: 'success',
    messageProperty: 'message',
    constructor: function (config) {
        Ext.apply(this, config);
        this.callParent([config]);
        return this;
    }
});

这样就可以很方便的用自己写的BaseStore基类了。

未完待续。。。

秒客网

Extjs4如何构造store基类

相关文章