带有索引的 SwiftUI ForEach

在 SwiftUI 中，我们可以通过 ForEach 来遍历集合类型（如数组和字典）并为每个元素生成视图。但如果需要在视图中显示项目的索引，该怎么办呢？本文将介绍如何在 SwiftUI 中使用带有索引的 ForEach。

基本 ForEach

首先，让我们看一下普通的 ForEach 用法：

ForEach(0..<5) { index in
   Text("Item \(index)")
}

这将生成 5 个 Text 视图，从 "Item 0" 到 "Item 4"。在闭包中，我们可以将项目的索引用作参数。

带有索引的 ForEach

如果需要在视图中使用索引并在闭包中引用它，则可以通过增加一个单独的参数来实现，如下所示：

ForEach(Array(zip(0..., items))) { index, item in
   Text("Item \(index): \(item)")
}

这将生成与之前相同的文本视图，但是现在在闭包中，我们可以使用 index 来访问每个对象的索引。

我们使用 zip 函数将索引和项目合并为带元组的单个序列。然后，我们强制将序列作为数组传递给 ForEach。由于数组的元素类型是元组 (Int, Item)，我们可以使用解包操作符访问元组中的每个成员。

在视图中使用索引

现在，我们可以将 index 参数用于生成视图中的任何内容。例如，这里我们使用 index 构建一个列表：

List(Array(zip(0..., items))) { index, item in
   Text("\(index): \(item)")
}

如果您愿意，还可以使用它来更改项目的显示方式：

Text("\(index % 2 == 0 ? "○" : "●") \(item)")

如上所述，我们可以在闭包中使用 index 访问项目的索引，并对其进行任何操作。

结论

本文介绍了如何在 SwiftUI 中使用带有索引的 ForEach 来遍历项目集合和生成视图。通过使用 zip 函数和元组，您可以快速轻松地访问项目的索引，并在任何视图中将其用于显示或操作。