extjs Grouping Store sort에 대한 궁금증

4122 단어
extjs 버전 2.1
extjs의 그룹store로 데이터를 불러오는 데 문제가 발생했습니다. 우선store는 다음과 같이 정의합니다.
var store = new Ext.data.GroupingStore({
        reader: new BidResultItemXmlReader(),
        url: Ipms.StateAssetOfficeService + '/QueryBidResultItem',
        sortInfo: { field: 'id', direction: "DESC" },
        groupField: 'groupField'
    });

이 코드를 한 글자로 분석합니다: URL에서 데이터를 불러오고 id에 따라 순서를 낮추고 그룹필드로 그룹화합니다.
그러나 최종 페이지에서 보여준 데이터는 다음과 같다.
백그라운드에서 보내는 데이터는 확실히 id 내림차순으로 배열되어 있다.
Ext 정렬, 그룹에 대한 이해가 부족하고 글자로만 억측하기 때문이다.
1.Store.js에서 데이터를 로드하는 방법loadRecords() 소스는 다음과 같습니다.
loadRecords : function(o, options, success){
    // ...
                                                                                                                                                                                                                                           
    this.applySort(); //  GroupingStore 
                                                                                                                                                                                                                                           
    // ..
}

2.GroupingStore.js의 applysort () 소스:
applySort : function(){
        Ext.data.GroupingStore.superclass.applySort.call(this);
        if(!this.groupOnSort && !this.remoteGroup){
            var gs = this.getGroupState();
            if(gs && gs != this.sortInfo.field){ //  
                this.sortData(this.groupField); //  Store 
            }
        }
    },

원본에서 알 수 있듯이, 우리의 정렬 필드와 그룹 필드가 같은 열이 아니라면, 그는 다시 그룹 필드로 정렬할 것이다.
3.Store.js의 sortData() 소스:
// private
sortData : function(f, direction){
    direction = direction || 'ASC';
    var st = this.fields.get(f).sortType;
    var fn = function(r1, r2){
        var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
        return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
    };
    this.data.sort(direction, fn);
    if(this.snapshot && this.snapshot != this.data){
        this.snapshot.sort(direction, fn);
    }
},

4. 그룹을 나누기 전에 먼저 그룹 필드에 따라 정렬하는 이유는 두 가지가 있다.
A. 정렬 필드는 그룹 필드와 다르기 때문에 정렬된 후에도 그룹이 정렬된 순서를 깰 수 있습니다.
B. GroupingView 의 쓰기 방법과 관련이 있습니다. 다음 글을 참조하십시오.
5.GroupingView.js의 doRender() 소스 코드(삭제):
doRender : function(cs, rs, ds, startRow, colCount, stripe){
    var groups = [], curGroup, i, len, gid;
        for(i = 0, len = rs.length; i < len; i++){
            var rowIndex = startRow + i;
            var r = rs[i],
                gvalue = r.data[groupField],
                g = this.getGroup(gvalue, r, rowIndex, colIndex, ds);
            if(!curGroup || curGroup.group != g){ //  
                curGroup = {
                    group: g,
                    gvalue: gvalue,
                    groupId: gid,
                    startRow: rowIndex,
                    rs: [r]
                };
                groups.push(curGroup);
            }else{
                curGroup.rs.push(r);
            }
            r._groupId = gid;
        }
}

이 방법은 그룹 목록을 구성하는 것이다. 간단하게 말하면 그룹스토어의 모든 항목을 순환해서 그룹필드의 값이 현재 그룹의 값과 같다면 이 항목을 현재 그룹에 넣는다.그렇지 않으면 그룹을 새로 만듭니다.
그가 이렇게 하는 것은store가 그룹필드를 따라 정렬되었다고 가정하는 것이다.applysort () 방법에서, 우리는 그가 그룹 필드에 따라 오름차순으로 정렬하도록 강요하는 것을 발견했다.이것이 바로 최종 보기를 초래하는 원인이다.
6. 비아냥거리다.서비스 쪽에서 클라이언트 그룹을 정렬하는 것은 사건이 매우 믿을 수 없는 일이다.Ext의 처리 방식은 더욱 믿을 수 없다.
7. 절충의 방법: 어떤 필드에 따라 그룹을 나누고 그룹 내의 항목은 어떤 필드에 따라 그룹을 나눈다.그래서 아예 정렬과 그룹을 서버에 두거나 클라이언트가 처리하지 않는다.클라이언트에 두든지 서버 측이 관여하지 않는다.
8. 우리는 정렬과 그룹을 서버 쪽에서 완성하는데 한계가 있다
var store = new Ext.data.GroupingStore({
        reader: new BidResultItemXmlReader(),
        url: Ipms.StateAssetOfficeService + '/QueryBidResultItem',
        sortInfo: { field: 'id', direction: "DESC" },
        remoteSort: true, //  1
        remoteGroup: true,//  2
        groupField: 'groupField'
    });

다음으로 전송:https://blog.51cto.com/wangyuelucky/1341614

좋은 웹페이지 즐겨찾기