当前位置: 首页 > news >正文

按拼音首字母进行排序组成新的数组(vue)

数据按首字母相同的组成新的数组,使用​​拼音(Pinyin)转换​​
比如想要的效果:
在这里插入图片描述
在这里插入图片描述

下载

npm install pinyin

代码:

import pinyin from "pinyin";
let studentAllList = [{onLine: true,points: undefined,stDevicemac: "8986032296027887733",stName: "钱里里",stNo: 1054032,stNumber: "8986032342202715675",stShNo: 410,},{onLine: true,points: undefined,stDevicemac: "8886032296027889728",stName: "董小琳",stNo: 1056045,stShNo: 407,},{onLine: true,points: undefined,stDevicemac: "8886032296027889729",stName: "小茗同学",stNo: 1056046,stShNo: 408,},{onLine: true,points: undefined,stDevicemac: "8886032296027889727",stName: "董在德",stNo: 1056049,stShNo: 409,}
];
// 组成首字母排列的数组
const formatPeoArray = (value) =>{return value.reduce((acc, person) => {const firstLetter = pinyin(person.stName[0], {style: pinyin.STYLE_NORMAL,})[0][0].toUpperCase().charAt(0);const foundKey = acc.find((item) => item.key === firstLetter);if (foundKey) {foundKey.list.push(person);} else {acc.push({key: firstLetter,list: [person],});}return acc;}, []).sort((a, b) => a.key.localeCompare(b.key)); // 按字母顺序排序
}
console.log(studentAllList);
console.log(formatPeoArray(studentAllList));

在这里插入图片描述

http://www.dtcms.com/a/176400.html

相关文章:

  • Prometheus实战教程:k8s平台-Redis监控案例
  • MySQL-数据查询(多表连接JOIN)-04-(11-2)
  • Go——项目实战
  • Kotlin zip 函数的作用和使用场景
  • 【纯小白博客搭建】Hugo+Github博客部署及主题(stack)美化等界面优化记录
  • DELL R770 服务器,更换OCP模块!
  • 使用 Java 11 的 HttpClient 处理 RESTful Web 服务
  • LLM :Function Call、MCP协议与A2A协议
  • 「Mac畅玩AIGC与多模态24」开发篇20 - 多语言输出工作流示例
  • 面试算法刷题练习1(核心+acm)
  • 力扣——25 K个一组翻转链表
  • 【PostgreSQL数据分析实战:从数据清洗到可视化全流程】7.3 动态报表生成(Jupyter Notebook/ReportLab)
  • python批量配置交换机简单实现
  • 场景可视化与数据编辑器:构建数据应用情境​
  • 居民健康监测小程序|基于微信小程序的居民健康监测小程序设计与实现(源码+数据库+文档)
  • OSCP - Proving Grounds - Sumo
  • 深度学习中常见的矩阵变换函数汇总(持续更新...)
  • 尚硅谷-硅谷甄选项目记录
  • 【2019 CWE/SANS 25 大编程错误清单】12越界写入
  • 二叉平衡树
  • 【解决方案】CloudFront VPC Origins 实践流程深入解析 —— 安全高效架构的实战之道
  • 格雷狼优化算法`GWO 通过模拟和优化一个信号处理问题来最大化特定频率下的功率
  • Node.js vs 浏览器中的JavaScript:区别全解析
  • 【计算机视觉】OpenCV实战项目:Long-Exposure:基于深度学习的长时间曝光合成技术
  • 【大模型ChatGPT4+Python】数据分析与可视化、人工智能建模及论文高效撰写
  • ECMAScript 2016(ES2016):JavaScript 生态的精细化完善
  • Kubernetes生产级资源管理实战:从QoS策略到OOM防御体系
  • SAP BC 私有云用户安全策略的问题
  • C#与Halcon联合编程
  • 【今日三题】跳台阶扩展问题(找规律) / 包含不超过两种字符的最长子串 / 字符串的排列(回溯—全排列)