What does List var in NavigationLink mean in SwiftUI

Question

The following is my code for my simple contentView

struct ContentView: View {
    @State private var selection = 1;
    @State private var addFood = false;
    var listItems = [
        Food(name: "List Item One"),
        Food(name: "List Item Two")
    ]
    var body: some View {
        TabView(selection: $selection) {
            NavigationView {
                List(listItems){
                    food in NavigationLink(destination: FoodView(selec: selection)) {
                        Text(food.name)
                    }
                }.navigationBarTitle(Text("Fridge Items"), displayMode: .inline)
                .navigationBarItems(trailing:
                                        NavigationLink(destination: FoodView(selec: selection)) {
                                            Image(systemName: "plus.circle").resizable().frame(width: 22, height: 22)
                                        } )
            }
            .tabItem {
                Image(systemName: "house.fill")
                Text("Home")
            }
            .tag(1)
            
            
            Text("random tab")
                .font(.system(size: 30, weight: .bold, design: .rounded))
                .tabItem {
                    Image(systemName: "bookmark.circle.fill")
                    Text("profile")
                }
                .tag(0)
        }
        
    }
    
    
    
}

struct FoodView: View{
    var selec: Int?
    var body: some View{
        NavigationView{
            Text("food destination view \(selec!)");
        }
    }
}

I follow some tutorials to get to this point. However, I'm confused about the syntax

List(listItems){
                    food in NavigationLink(destination: FoodView(selec: selection)) {
                        Text(food.name)
                    }

What does the above line mean? My guess is that we list out the items we have, and then for each food we have, we add a navigation link for them. However, that's my guess and I want to know the true syntax behind this. I've already read the documentation about List and also go through the official documentation about swift syntax. I didn't find anything useful. I thought it was a closure first, but I found there is still a difference. Could anyone help, please.

Does this answer your question https://stackoverflow.com/questions/56434549/what-enables-swiftuis-dsl? — Asperi, Dec 23 '20 at 12:28
Think of `List(listItems) { food in ... }` like a for loop: `for food in listItems { ... }`. Each element of the list is passed in `food`, and the content (in this case `NavigationLink`) is returned. — George, Dec 23 '20 at 15:22

score 0 · Accepted Answer · answered Dec 23 '20 at 13:04

List is a struct which is a View, and it takes a closure as a parameter when initialising itself.

You can image this closure as a function , so that this function is kind of like this.

func imagineFunc(item: YourItem) -> YourRowContent { //some code goes here return YourRowContent }

Note: above function is only for explanation. there are no such types.

so , when ListView wants to create one of its rows , then List call this given closure(imagineFunc) and get made a RowContent/row view.

According to your code when List view call the given closure(for each row) you have return a NavigationLink(You can imagine this as a button which can navigate to another view when it is inside navigation view). So that each row becomes a NavigationLink in your List.

What does List var in NavigationLink mean in SwiftUI

1 Answers1