extjs Grouping Store sort에 대한 궁금증
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
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.