몇 줄 코드로 Grid 중국어 정렬 오류 해결

Grid는 Column Header를 클릭하여 정렬하는 기능을 실현할 수 있습니다. 영어/숫자에 대한 정렬은 정상적이지만 한자라면 한자의 정렬이 일반적인 순서에 부합되지 않습니다(일반적인 한자 정렬은 GB2313 국표 라이브러리의 인코딩 순서에 따라 정렬되며 사용자 인터페이스에 나타나는 것은 병음에 따라 한자를 정렬하는 것입니다).사실 이것도 버그가 적지 않다. 어쨌든 EXT는 외국의 작품이기 때문이다.우리가 EXT 내핵에 깊이 들어가기만 하면 그 정렬의 기리를 발견할 수 있다. 이것은 EXT.data를 통해서이다.Store의 applySort 함수는 다음과 같이 구현됩니다.

                        applySort: function(){
                                if(this.sortInfo && !this.remoteSort){
                                        var s = this.sortInfo, f = s.field;
                                        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(s.direction, fn);
                                        if(this.snapshot && this.snapshot != this.data){
                                                this.snapshot.sort(s.direction, fn);
                                        }
                                }
                        }

정렬 원리를 알게 되면 우리는 한자의'정상'정렬을 쉽게 실현할 수 있다. 그 방법은 Ext.data를 만드는 것이다.스토어 대상의 실례 전에 이 applysort 함수를 다시 불러옵니다.코드는 다음과 같습니다.

                        //   Ext.data.Store.prototype.applySort   DataStore  
                        // var _applySort = Ext.data.Store.prototype.applySort;        
                        // ，  applySort  
                        Ext.data.Store.prototype.applySort = function(){       
                                 //  applySort
                                if(this.sortInfo && !this.remoteSort){
                                        var s = this.sortInfo, f = s.field;
                                        var st = this.fields.get(f).sortType;
                                        var fn = function(r1, r2){
                                                var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
                                                //  : Bug
                                                if(typeof(v1) == "string"){ // ，
                                                        return v1.localeCompare(v2);
                                                        //  localeCompare  , Firefox   IE  
                                                }
                                                //  
                                                return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
                                        };
                                        this.data.sort(s.direction, fn);
                                        if(this.snapshot && this.snapshot != this.data){
                                                this.snapshot.sort(s.direction, fn);
                                        }
                                }
                        };
                        var ds = new Ext.data.Store(......);// 。。。

관건은 문자열 유형의 변수에 대해 현지화된 문자열 비교 함수localeCompare () 로 기존의 간단한 변수 비교를 대체하는 것이다.