How to append to an array in SwiftUI?

Question

Having problems with appending to an array in SwiftUI.

I'm on Xcode 11 beta 7 and using the updated ObservableObject, EnvironmentObject and Published syntax on a watchOS app. WKHostingController expects concrete types so passing ContentView().environmentObject(subject) is not possible.

This line crashes the app:

self.subjectData.store.append(Subject(name: self.addedSubject, isFavorite: false)) 

Any ideas on what is wrong?

struct Subject: Codable, Identifiable {
    var id: UUID = UUID()
    var name: String
    var isFavorite: Bool
}

class SubjectDataEnv: ObservableObject {
    @Published var store = [
        Subject(name: "Physics", isFavorite: true),
        Subject(name: "Science", isFavorite: false)
    ]
    @Published var selectedSubject = Subject(name: "Subject 1", isFavorite: false)
}

class HostingController: WKHostingController<ContentView> {
    override var body: ContentView {
        return ContentView()
    }
}

struct ContentView: View {
    @State var subjectData = SubjectDataEnv()

    var body: some View {
        SubjectView().environmentObject(subjectData)
    }
}

struct SubjectView: View {
    @EnvironmentObject var subjectData: SubjectDataEnv
    var body: some View {
        List {
            ForEach(subjectData.store) { subject in
                NavigationLink(destination: DurationView()
                    .environmentObject(self.subjectData)
                )
            }
            NavigationLink(destination: AddSubjectView()
                .environmentObject(self.subjectData)
            ) {
                Text("+")
            }
        }
    }
}

struct AddSubjectView: View {  
    @EnvironmentObject var subjectData: SubjectDataEnv
    @State var addedSubject: String = "subject"
    var body: some View {
        VStack(alignment: .leading, spacing: 0) {
            TextField("Add your subject", text: $addedSubject)
            Button(action: {
                self.subjectData.store.append(Subject(name: self.addedSubject, isFavorite: false))   // crashes the app
            }) {
                Text("Done")
            }
        }
    }
}

Answer 1

Two approaches are possible:

1. Using AnyView

class HostingController: WKHostingController<AnyView> {
    override var body: AnyView {
        return AnyView(AddSubjectView().environmentObject(SubjectDataEnv()))
    }
}

Here's the output (I attached a print in the button):

print(self.subjectData.store)

Subject(id: 2F3745EE-752B-4C8C-8A4F-8C21E73B315C, name: "Physics", isFavorite: true)
Subject(id: 5A9CF711-F6BE-4854-8F58-35FD004B2419, name: "Science", isFavorite: false)
Subject(id: E2F6A25E-3BC0-4D17-9AEF-07286533D475, name: "👌🏻", isFavorite: false)
Subject(id: 62FA7D12-A3D5-4381-8232-F48268B433F1, name: "☺️", isFavorite: false)

Notice the new 👌🏻 and ☺️ subjects there.

2. Injecting the @EnvironmenObject in a "parent view"

class HostingController: WKHostingController<ContentView> {
    override var body: ContentView {
        return ContentView()
    }
}

struct ContentView: View {
    var body: some View {
        return AddSubjectView().environmentObject(SubjectDataEnv())
    }
}

The latter will produce the same results.