Heim > Web-Frontend > js-Tutorial > Hauptteil

So implementieren Sie die A-Z-Sortierung des chinesischen Pinyin in js

php中世界最好的语言
Freigeben: 2018-04-11 16:07:55
Original
2847 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie die A-Z-Sortierung des chinesischen Pinyin in js implementieren. Was sind die Vorsichtsmaßnahmen für die Implementierung der A-Z-Sortierung des chinesischen Pinyin in js Fall, werfen wir einen Blick darauf.

Um Chinesisch nach der A-Z-Methode umzusetzen, können Sie in den Methoden von vue schreiben:

methods:{
        pySort:function(arr,empty){
          var $this = this;
          if(!String.prototype.localeCompare)
            return null;
          var letters = "ABCDEFGHJKLMNOPQRSTWXYZ".split('');
          var zh = "阿八嚓哒妸发旮哈讥咔垃痳拏噢妑七呥扨它穵夕丫帀".split('');
          var arrList = [];
          for(var m =0;m<arr.length;m++){
            arrList.push(arr[m].name);
          }
          var result = [];
          var curr;
          for(var i=0;i<letters.length;i++){
            curr = {letter: letters[i], data:[]};
            if(i!=26){
              for(var j =0;j<arrList.length;j++){
                var initial = arrList[j].charAt(0);//截取第一个字符
                if(arrList[j].charAt(0)==letters[i]||arrList[j].charAt(0)==letters[i].toLowerCase()){  //首字符是英文的
                  curr.data.push(arrList[j]);
                }else if(zh[i]!=&#39;*&#39;&&$this.isChinese(initial)){   //判断是否是无汉字,是否是中文
                  if(initial.localeCompare(zh[i]) >= 0 &&(!zh[i+1]||initial.localeCompare(zh[i+1]) <0)) {  //判断中文字符在哪一个类别
                    curr.data.push(arrList[j]);
                  }
                }
              }
            }else{
              for(var k =0;k<arrList.length;k++){
                var ini = arrList[k].charAt(0);      //截取第一个字符
                if(!$this.isChar(ini)&&!$this.isChinese(ini)){
                  curr.data.push(arrList[k]);
                }
              }
            }
            if(empty || curr.data.length) {
              result.push(curr);
              //curr.data.sort(function(a,b){
              //  return b.localeCompare(a);    //排序,英文排序,汉字排在英文后面
              //});
            }
          }
          return result;
        },
        isChinese:function(temp){
          var re=/[^\u4E00-\u9FA5]/;
          if (re.test(temp)){return false;}
          return true ;
        },
        isChar:function(char){
          var reg = /[A-Za-z]/;
          if (!reg.test(char)){return false ;}
          return true ;
        }
       }
Nach dem Login kopieren

Konvertieren Sie das von PHP erhaltene JSONObjekt in ein Array und rufen Sie es direkt in vue auf -> this.pySort(arr); js kann die Methode pySort(arr) direkt aufrufen im A-Z-Format

Das in der Konsolenausgabe angezeigte Format ist wie folgt:

Der Schlüsselwert A-Z

wird im Buchstaben gespeichert Daten: speichert das sortierte Array

Für Vue, das auf der Seite platziert werden muss, verwenden Sie v-for-Schleife v-for="(key, value) in arr"

Um den Wert des Datenarrays zu erhalten, verwenden Sie weiterhin v-for="tmp in (key.data)", um die Elemente zu durchlaufen, die Sie eingeben möchten

Es ist relativ einfach zu schreiben und diese Methode ist auch in js üblich.

Ich glaube, Sie haben die Methode beherrscht, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln PHP chinesische Website!

Empfohlene Lektüre:

Wie man mit der Optionsüberlagerung von „select“ umgeht

Vue Mobile UI Framework implementiert Seitenmenü-Plugin -in der Wirkung

Das obige ist der detaillierte Inhalt vonSo implementieren Sie die A-Z-Sortierung des chinesischen Pinyin in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!