vue 中对城市列表根据首字母进行排序

vue 中对城市列表根据首字母进行排序

vue中根据城市的首字母a-z进行排序
先安装 js-pinyin 依赖:

npm i --save js-pinyin

然后在组件中引入:

import pyjs from 'js-pinyin'

export default {
  async mounted() {
    let city = [
      {
        name: '北京'
      },
      {
        name: '上海'
      },
      {
        name: '广州'
      },
      {
        name: '武汉'
      },
      {
        name: '浙江'
      },
      {
        name: '海口'
      }
    ] // 城市列表
    let blocks = [] // 新列表
    let p, c
    let d = {}
    
    city.forEach(item => {
      p = pyjs.getFullChars(item.name).toLocaleLowerCase().slice(0, 1)
      c = p.charCodeAt(0) // charCodeAt() 方法可返回指定位置的字符的 Unicode 编码。这个返回值是 0 - 65535 之间的整数。
      if (c > 97 && c < 123) { // 小写的 a-z if (!d[p]) { d[p] = [] } d[p].push(item.name) } }) for(let [k, v] of Object.entries(d)) { blocks.push({ title: k.toUpperCase(), city: v }) } blocks.sort((a, b) => a.title.charCodeAt(0) - b.title.charCodeAt(0))
    console.log(blocks) // 得出结果
    
  }
  
}

黄良钵

博客站长,前端开发工程师

发表评论

电子邮件地址不会被公开。 必填项已用*标注

微信扫一扫

微信扫一扫

微信扫一扫,分享到朋友圈

vue 中对城市列表根据首字母进行排序
返回顶部
网站稳定运行 : {{ diffYears }}年 零 {{ diffDays }}天 {{ diffHours }} 小时 {{ diffMinutes }} 分钟 {{ diffSeconds }} 秒

显示

忘记密码?

显示

显示

获取验证码

Close