问题描述

Extjs4使用mvc模式，封装Store层的ArrayStore无法动态加载后台数据

store层代码

 Ext.define('Desktop.store.function.FunctionStore'{    extend: 'Ext.data.ArrayStore'    requires:['Desktop.model.function.UserModel']    model: 'Desktop.model.function.UserModel'    autoLoad: true    proxy:{        type:'ajax'        url:'index/userFindAll.do'        reader: {            type: 'json'        }    }});

view层代码

 Ext.define('Desktop.view.function.FunctionGrid' {    extend: 'Ext.panel.Panel'    requires: ['Desktop.store.function.FunctionStore']    alias: 'widget.itgrid'    itemId: 'sampleTest'    layout: {        type: 'border'    }    title: '表单'    initComponent: function() {        var me = this;        var store = Ext.create('Desktop.store.function.FunctionStore');        store.load();//        var store = Ext.create('Ext.data.ArrayStore'{//          model:'Desktop.model.function.UserModel'//          proxy:{//              type:'ajax'//              url:'index/userFindAll.do'//          }//        });//        store.load();        //声明行编辑器插件        var rowEditing = Ext.create('Ext.grid.plugin.RowEditing' {            clicksToMoveEditor: 1            autoCancel: false        });        //复选框插件        var sm = Ext.create('Ext.selection.CheckboxModel');        Ext.applyIf(me {            items: [{                id:'itl'                xtype:'gridpanel'                bodyPadding: 0                region: 'center'                columns: [{                    text: 'id'                    width: 97                    sortable: true                    renderer: this.change                    dataIndex: 'id'                }{                    text: 'groupId'                    width: 97                    sortable: true                    renderer: this.pctChange                    dataIndex: 'groupId'                }{                    text: 'userName'                     locked: true                    width: 200                    sortable: false                    dataIndex: 'userName'                }{                    text: 'userPass'                    width: 97                    sortable: false                    dataIndex: 'userPass'                }{                    text: 'userDes'                    width: 97                    sortable: false                    dataIndex: 'userDes'                }{                    text: 'modifyTime'                    width: 97                    sortable: false                    dataIndex: 'modifyTime'                }{                    text: 'userPass'                    width: 97                    sortable: false                    dataIndex: 'userPass'                }{                    text: 'userDes'                    width: 97                    sortable: false                    dataIndex: 'userDes'                }{                    text: 'modifyTime'                    width: 97                    sortable: false                    dataIndex: 'modifyTime'                }{                    text: 'userPass'                    width: 97                    sortable: false                    dataIndex: 'userPass'                }{                    text: 'userDes'                    width: 97                    sortable: false                    dataIndex: 'userDes'                }{                    text: 'userPass'                    width: 97                    sortable: false                    dataIndex: 'userPass'                }{                    text: 'userDes'                    width: 97                    sortable: false                    dataIndex: 'userDes'                }]                store: store                selModel: sm            }]        });         me.callParent(arguments);    }    change: function (val) {        if (val > 0) {            return '<span style=""color:green;"">' + val + '</span>';        } else if (val < 0) {            return '<span style=""color:red;"">' + val + '</span>';        }        return val;    }    pctChange: function (val) {        if (val > 0) {            return '<span style=""color:green;"">' + val + '%</span>';        } else if (val < 0) {            return '<span style=""color:red;"">' + val + '%</span>';        }        return val;    }});

解决方案

还是自己回答吧，没有悬赏的分。。
我发现把extend：继承的ArrayStore改成Store就好了，具体原因没时间研究，刚学了两个星期，工作需要不得不先做。同时我还发现了extjs4版本的gridpanel中tabpanel中嵌入gridpanel，如果多列，同时设置某列locked，就会出现格式错位，后来使用Store就没有这个问题了，不知道为什么ArrayStore会有这个问题。

解决方案二：
在线等，求大神解惑！！！