โจForEach examples
Loop over a range of integers
// init(
// _ data: Range<Int>,
// content: @escaping (Int) -> Content
// )
// ---------------------------------------
// ForEach<Range<Int>, Int, Text>
// Data = Range<Int>
// ID = Int
// Content = Text
struct ContentView: View {
let positions = ["First", "Second", "Third"]
var body: some View {
ForEach(0..<positions.count) { index in
Text(positions[index])
}
}
}
Loop over any data
Loop over an array of strings and specified \.self
key path, which refers to the string itself as an identifier.
// init(
// _ data: Data,
// id : KeyPath<Data.Element, ID>,
// content: @escaping (Data.Element) -> Content
// )
// ------------------------------------------------
// ForEach<[String], String, Text>
// Data = [String]
// ID = String
// Content = Text
struct ContentView: View {
let coworkers = [
"Gabriel Lang", "John Brunelle", "Matthewย Arieta", "Wayne Ohmer",
"Ralph Dugue", "Alex Burnett", "Craig Heneveld", "Bill Munsell"
]
ย ย ย ย ย ย ย ย
var body: some View {
VStack {
ForEach(coworkers, id: \.self) { name in
Text(name)
}
}
}
}
Loop over custom type.
// custom type
struct Position {
let id : Int
let name: String
}
// loop over custom type
struct ContentView: View {
let positions = [
Position(id: 1, name: "First"),
Position(id: 2, name: "Second"),
Position(id: 3, name: "Third")
]
var body: some View {
ForEach(positions, id: \.id) { position in
Text(position.name)
}
}
}
// ForEach<[Position], Int, Text>
// ------------------------------
// Data = [Position]
// ID = Int
// Content = Text
Loop over Identifiable data
The last one is the most compact form of all three, but it required each element in a collection to conform Identifiable
protocol.
extension ForEach where
ID == Data.Element.ID,
Content : View,
Data.Element: Identifiable
{
public init(
_ data: Data,
@ViewBuilder content: @escaping (Data.Element) -> Content
)
}
ไธ้ขไพๅญไธญ็่ช่จๅๅฅ็จๅพฎๆนไธไธ๏ผๅฐฑๅฏไปฅไฝฟ็จ้ๅ initializerใ
// conform to `Identifiable`
struct Position: Identifiable {
let id: Int
let name: String
}
// loop over Identifiable data
struct ContentView: View {
let positions = [
Position(id: 1, name: "First"),
Position(id: 2, name: "Second"),
Position(id: 3, name: "Third")
]
var body: some View {
ForEach(positions) { position in
Text(position.name)
}
}
}
// ForEach<[Position], Int, Text>
// ------------------------------
// Data = [Position]
// ID = Int
// Content = Text
examples for ForEach.
Last updated