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) // 得出结果
    
  }
  
}