OpenHarmony ListView怎么排序

在 OpenHarmony（ArkUI） 里，并没有像 Android 那样的 ListView 控件，而是使用 List + ForEach 来展示列表。所谓“ListView 排序”，本质上是对数据源进行排序，然后重新渲染 List。

下面按常见场景给你说明。

一、最常用方式：对数据源排序（推荐）

1️⃣ 数据模型

class Item {
  id: number
  name: string
  age: number

  constructor(id: number, name: string, age: number) {
    this.id = id
    this.name = name
    this.age = age
  }
}

2️⃣ 使用 @State 保存列表数据

@Entry
@Component
struct ListViewSortExample {
  @State items: Item[] = [
    new Item(1, "张三", 20),
    new Item(2, "李四", 18),
    new Item(3, "王五", 25)
  ]

3️⃣ List 渲染

  build() {
    Column() {
      Button("按年龄排序")
        .onClick(() => {
          this.items.sort((a, b) => a.age - b.age)
        })

      List() {
        ForEach(this.items, (item: Item) => {
          ListItem() {
            Text(`${item.name} - ${item.age}`)
              .fontSize(18)
              .padding(10)
          }
        })
      }
    }
  }
}

✅ 关键点：

• List 只是展示
• 排序一定要作用在 items 上
• @State 会触发 UI 刷新

二、升序 / 降序切换

@State sortAsc: boolean = true

Button("切换排序")
  .onClick(() => {
    this.sortAsc = !this.sortAsc
    this.items.sort((a, b) =>
      this.sortAsc ? a.age - b.age : b.age - a.age
    )
  })

三、字符串排序（中文）

this.items.sort((a, b) =>
  a.name.localeCompare(b.name, "zh-Hans-CN")
)

四、不可变排序（推荐写法）

避免直接修改原数组：

this.items = [...this.items].sort((a, b) => a.age - b.age)

五、常见误区 ❌

六、如果你用的是老 API（eTS / ListContainer）

如果你指的是 OpenHarmony 3.x 的 ListContainer，也可以告诉我，我可以给你老写法示例。

✅ 总结一句话

OpenHarmony 中 ListView 排序 = 对 @State 数组排序

如果你有具体排序规则（比如多字段、分组、懒加载），可以继续问我。