js怎么实现中文按照A-Z排序

这次给大家带来js怎么实现中文按照A-Z排序,js实现中文按照A-Z排序的注意事项有哪些,下面就是实战案例,一起来看一下。

实现中文按照A-Z的方法,可以在vue的methods里面写入:

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= 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 ;        }       }

登录后复制

将从php中获取的json对象转换成数组,vue中直接调用->this.pySort(arr); js直接调用pySort(arr)方法即可    即可实现按照A-Z的格式排序

如下图在控制台输出的格式:

js怎么实现中文按照A-Z排序

letter中存放键值A-Z

data:存放排序后的数组

至于vue中需要放在页面中,使用v-for循环即可 v-for=”(key,value) in arr”

需要获取data数组的值,继续使用v-for=”tmp in (key.data)”循环在你想输入摆放的元素中

写的比较简单,这个方法在js中也通用

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

vue项目怎样通过百度的BAE发布

AngularJS中@HostBinding()和@HostListener()有什么区别

以上就是js怎么实现中文按照A-Z排序的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2778694.html

(0)
上一篇 2025年3月8日 15:36:40
下一篇 2025年3月8日 15:36:47

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • js正则表达式之基本语法总结

    本文主要为大家分享一篇js正则表达式之基本语法总结,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧。 1.正则表达式基本语法 两个特殊的符号’^’和’$’。他们的作用是分别指出…

    编程技术 2025年3月8日
    000
  • vue.js怎样操作移动数组位置并且更新视图

    这次给大家带来vue.js怎样操作移动数组位置并且更新视图,vue.js操作数组移动位置并且更新视图的注意事项有哪些,下面就是实战案例,一起来看一下。 使用vue.js v-for绑定若干个选项,需要对选项进行排序上下移动操作。 需要对op…

    2025年3月8日
    200
  • vue.js中$set怎样给数组更新

    这次给大家带来vue.js中$set怎样给数组更新,vue.js中$set给数组更新的注意事项有哪些,下面就是实战案例,一起来看一下。 由于 JavaScript 的限制,Vue 不能检测以下变动的数组: 当利用索引直接设置数组的某一项时,…

    2025年3月8日
    200
  • 浅析JS执行机制

    本文主要为大家分享一篇浅析JS执行机制的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧 首先,请牢记2点: (1) JS是单线程语言 (2) JS的Event Loop是JS的执行机制。深入了解JS的执行,就等于深入了…

    2025年3月8日
    200
  • JS怎么实现满天星导航栏

    这次给大家带来JS怎么实现满天星导航栏,JS实现满天星导航栏的注意事项有哪些,下面就是实战案例,一起来看一下。 说明 分享一个满天星导航栏的效果,代码不多,但效果挺好看,先看看效果图吧。 解释 实现这个效果,需要掌握的知识不用很多,知道简单…

    2025年3月8日
    200
  • pm2部署node.js项目详细教程

    这次给大家带来pm2部署node.js项目详细教程,pm2部署node.js项目的注意事项有哪些,下面就是实战案例,一起来看一下。 作为一个前端,对写好的项目怎么部署到服务器是一脸蒙圈的,但还是对这个很感兴趣,决定尝试一下,说干就干。 一、…

    2025年3月8日 编程技术
    200
  • vue.js+layer的表格数据绑定与更新

    这次给大家带来vue.js+layer的表格数据绑定与更新,vue.js+layer表格数据绑定与更新的注意事项有哪些,下面就是实战案例,一起来看一下。 一:先使用Vue.js绑定好数据与更新事件 使用v-on绑定好事件,在事件里边直接把该…

    2025年3月8日 编程技术
    200
  • 使用vue.js的嵌套循环、if判断、动态删除图文详解

    这次给大家带来使用vue.js的嵌套循环、if判断、动态删除图文详解,使用vue.js的嵌套循环、if判断、动态删除的注意事项有哪些,下面就是实战案例,一起来看一下。 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据…

    2025年3月8日
    200
  • JS里怎么使用import 和require打包

    这次给大家带来JS里怎么使用import 和require打包,JS里使用import 和require打包的注意事项有哪些,下面就是实战案例,一起来看一下。 前言: 之前使用ES6写代码,webpack打包后上线,一点问题没有,也看过打包…

    编程技术 2025年3月8日
    200
  • Vue-cli项目如何获取本地的json文件

    这次给大家带来Vue-cli项目如何获取本地的json文件,Vue-cli项目获取本地的json文件的注意事项有哪些,下面就是实战案例,一起来看一下。 在自己做的vue demo项目中,我想通过在本地添加一些json数据,写到json文件中…

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论