小程序中英文混合排序问题解决


Posted in Javascript onAugust 02, 2019

小程序中英文混合排序问题

在开发一个手机联系人列表的功能时,遇到需求是需要将联系人列表按照拼音顺序排序。而联系人列表是会出现中英文混合的情况。于是遇到了问题。

小程序无法直接中文进行排序

localeCompare函数排序出来的结果不正确

在遇到这个问题的时候,也去网上查过不少,本来觉得比较好用的就是例佣localeCompare函数去进行排序。但是在实际开发的时候发现该函数的排列结果跟网上的不同。(大概是h5跟小程序的区别吧,我也不是很了解~)

最终参考了字母表的方式,采取了类似的做法来实现我的需求,代码如下

/* 返回拼音的首字母大写 */
 getCName(_char) {
  if (_char <= 'z' && _char >= 'A') {
   return _char.toUpperCase();
  }
  for (var item in pinyin) {
   if (pinyin[item].indexOf(_char) != -1)
    return item[0].toUpperCase();
  }
 },
  /* 对二维数组排序,并返回处理完逻辑的结果 */
 sortTwoArr(arr) {
  let res_arr=[];
  for (var j = 0; j < arr.length; j++) {
   for (var i = 0; i < arr.length - 1; i++) {
    if (arr[i+1][0] < arr[i][0]) {
     let temp = arr[i][0];
     arr[i][0] = arr[i+1][0];
     arr[i+1][0] = temp;
     
     let temp_ = arr[i][1];
     arr[i][1] = arr[i+1][1];
     arr[i+1][1] = temp_;
    }
   }
  }  
  arr.forEach((item)=>{
   res_arr.push(item[1])
  })
  return res_arr;
 }

在onLoad()函数调用

/**
  * 生命周期函数--监听页面加载
  */
 onLoad: function(options) {
  let arr = ['猫', '狐狸', '鸟', '大雁', 'A','彦杰','燕','朕成功','陈奕迅'];
  let arr1 = [];
  arr.forEach((item, index) => {
   var _char = item.substr(0, 1);
   let temp = [this.getCName(_char), item]
   arr1.push(temp);
  })
  console.log(this.sortTwoArr(arr1))
 },

结果演示

小程序中英文混合排序问题解决

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
window.name代替cookie的实现代码
Nov 28 Javascript
js不完美解决click和dblclick事件冲突问题
Jul 16 Javascript
document.getElementBy(&quot;id&quot;)与$(&quot;#id&quot;)有什么区别
Sep 22 Javascript
IE与FireFox的JavaScript兼容问题解决办法
Dec 31 Javascript
JQuery判断radio(单选框)是否选中和获取选中值方法总结
Apr 15 Javascript
ES6概念 ymbol.for()方法
Dec 25 Javascript
纯JS实现弹性导航条效果
Mar 06 Javascript
vue 2.0组件与v-model详解
Mar 27 Javascript
JS身份证信息验证正则表达式
Jun 12 Javascript
详解小程序如何避免多次点击,重复触发事件
Apr 08 Javascript
微信小程序可滑动周日历组件使用详解
Oct 21 Javascript
vue中解决chrome浏览器自动播放音频和MP3语音打包到线上的实现方法
Oct 09 Javascript
详解JWT token心得与使用实例
Aug 02 #Javascript
详解使用JWT实现单点登录(完全跨域方案)
Aug 02 #Javascript
基于mpvue的简单弹窗组件mptoast使用详解
Aug 02 #Javascript
vue下使用nginx刷新页面404的问题解决
Aug 02 #Javascript
超轻量级的js时间库miment使用解析
Aug 02 #Javascript
操作按钮悬浮固定在微信小程序底部的实现代码
Aug 02 #Javascript
微信小程序中悬浮窗功能的实现代码
Aug 02 #Javascript
You might like
10条PHP编程习惯助你找工作
2008/09/29 PHP
PHP中执行MYSQL事务解决数据写入不完整等情况
2014/01/07 PHP
PHPAnalysis中文分词类详解
2014/06/13 PHP
yii实现图片上传及缩略图生成的方法
2014/12/04 PHP
php通过asort()给关联数组按照值排序的方法
2015/03/18 PHP
PHP使用fopen与file_get_contents读取文件实例分享
2016/03/04 PHP
php中引用符号(&amp;)的使用详细介绍
2016/12/06 PHP
用javascript实现分割提取页面所需内容
2007/05/09 Javascript
图片格式的JavaScript和CSS速查手册
2007/08/20 Javascript
CSS JavaScript 实现菜单功能 改进版
2008/12/09 Javascript
JQuery中根据属性或属性值获得元素(6种情况获取方法)
2013/01/17 Javascript
ajax请求get与post的区别总结
2013/11/04 Javascript
js调试工具Console命令详解
2014/10/21 Javascript
AngularJS 输入验证详解及实例代码
2016/07/28 Javascript
JavaScript中数组slice和splice的对比小结
2016/09/22 Javascript
基于jQuery实现文字打印动态效果
2017/04/21 jQuery
angular select 默认值设置方法
2017/06/23 Javascript
微信小程序使用template标签实现五星评分功能
2018/11/03 Javascript
深入了解JavaScript代码覆盖
2019/06/13 Javascript
Flexible.js可伸缩布局实现方法详解
2020/11/13 Javascript
Vue 列表页带参数进详情页的操作(router-link)
2020/11/13 Javascript
[00:37]DOTA2上海特级锦标赛 OG战队宣传片
2016/03/03 DOTA
python调用c++返回带成员指针的类指针实例
2019/12/12 Python
python GUI库图形界面开发之PyQt5信号与槽基本操作
2020/02/25 Python
python3用urllib抓取贴吧邮箱和QQ实例
2020/03/10 Python
设置jupyter中DataFrame的显示限制方式
2020/04/12 Python
StudentUniverse英国:学生航班、酒店和旅游
2019/08/25 全球购物
波兰办公用品和学校用品在线商店:Dlabiura24.pl
2020/11/18 全球购物
责任担保书范文
2014/05/21 职场文书
工作散漫检讨书
2014/09/16 职场文书
大学生团支书竞选稿
2015/11/21 职场文书
《穷人》教学反思
2016/02/19 职场文书
个人工作总结(管理人员)范文
2019/08/13 职场文书
聊聊JS ES6中的解构
2021/04/29 Javascript
Python使用Kubernetes API访问集群
2021/05/30 Python
shell进度条追踪指令执行时间的场景分析
2022/06/16 Servers