HarmonyOS 鸿蒙Next 城市对象数据本地重构排序

建议后台将数据结构调整一下，带上首字母，以下为示例代码：

class CarTable {
 title: string = ''
 projects: string[] = []
}

[@Entry](/user/Entry)
[@Component](/user/Component)
struct AlphabetIndexPage {
 private value: string[] = ['选', 'A', 'B', 'C', 'D', 'E', 'F', 'G',
   'H', 'I', 'J', 'K', 'L', 'M', 'N',
   'O', 'P', 'Q', 'R', 'S', 'T', 'U',
   'V', 'W', 'X', 'Y', 'Z']
 [@State](/user/State) selectedIndex: number = 0
 [@State](/user/State) showDialog:boolean=false
 [@State](/user/State) isSelectIndexer: boolean = false
 listScroller: ListScroller = new ListScroller()

 private carList: CarTable[] = [
   {
     title: 'A',
     projects: ['奥迪', '埃安', 'AITO', '阿斯顿马丁', '阿尔法罗密欧', '阿维塔', '爱驰', 'Aria', 'ATS', 'Aspark', '阿尔特', 'AIM']
   },
   {
     title: 'B',
     projects: ['奔驰', '宝马', '本田', '别克', '比亚迪', '保时捷', '北京', '标致', '宾利', '宝骏', '奔腾', '宝沃', '布加迪']
   },
   {
     title: 'C',
     projects: ['长安', '起源', '长城', '创维', '成功', '车池', '刺猬', '长江', 'Canoo', '曹操', 'Cupra', '程式']
   },
   {
     title: 'D',
     projects: ['大众', '东风风行', '东风风神', '东风风行', '东风风神', '东风风行', '东风风神', '大发', '大运', '东南', 'DS']
   },
   {
     title: 'E',
     projects: ['Electra', 'E-lengend', 'ego', 'Edison']
   },
   {
     title: 'F',
     projects: ['丰田', '福特', '飞凡', '方程', '飞凡', '方程', '菲亚特', '法拉利']
   }
 ]

 [@Builder](/user/Builder)
 itemHead(text: string) {
   Text(text)
     .fontSize(20)
     .backgroundColor(0xAABBCC)
     .width("100%")
     .padding(10)
 }

 build() {
   Stack({ alignContent: Alignment.Start }) {
     Row() {
       List({ space: 0, initialIndex: 0, scroller: this.listScroller }) {
         ForEach(this.carList, (item: CarTable) => {
           ListItemGroup({ header: this.itemHead(item.title) }) {
             ForEach(item.projects, (project: string) => {
               ListItem() {
                 Text(project)
                   .width("100%")
                   .height(60)
               }
             }, (item: string) => item)
           }
         })
       }
       .width('70%')
       .height('100%')
       .sticky(StickyStyle.Header)
       .scrollBar(BarState.Off)
       .edgeEffect(EdgeEffect.None)
       .onScrollIndex((start: number, end: number) => {
         if (!this.isSelectIndexer) {
           this.showDialog=false
           this.selectedIndex = start + 1
         }
       })

       AlphabetIndexer({ arrayValue: this.value, selected: 0 })
         .selected(this.selectedIndex)
         .selectedColor(0xFFFFFF)// 选中项文本颜色
         .selectedBackgroundColor(0xCCCCCC)// 选中项背景颜色
         .usingPopup(true) // 是否显示弹出框
         .selectedFont({ size: 16, weight: FontWeight.Bolder })// 选中项字体样式
         .itemSize(28)// 每一项的尺寸大小
         .onSelect((index: number) => {
           this.showDialog = true
           this.isSelectIndexer = true
           this.listScroller.scrollToItemInGroup(index - 1, 0, true)
         })
     }
     .width('100%')
     .height('100%')
   }
 }
}