🅿️ObservableObject

SwiftUI ⟩ Data Flow ⟩ ObservableObject

• An observable object is a custom object (reference type) for your data that can be bound to a view from storage in SwiftUI’s environment.

• SwiftUI watches for any changes to observable objects that could affect a view, and displays the correct version of the view after a change.

💾 程式

// ⭐️ 1. import `Combine` framework
import Combine                      // for `ObservableObject`

// ⭐️ 2. conforms to `ObservableObject`
final class ModelData: ObservableObject {
    // ⭐️ 3. publish properties
    /// An observable object needs to publish any changes to its data,
    /// so that its subscribers can pick up the change.
    @Published var landmarks: [Landmark] = load("landmarkData.json")
}

struct LandmarksApp: App {
    
    // ⭐️ 4. use `@StateObject` to initialize a model object
    @StateObject private var modelData = ModelData()
    
    var body: some Scene {
        WindowGroup {
            ContentView()
                // ⭐️ 5. put the model object in the environment
                .environmentObject(modelData)
        }
    }
}

struct LandmarkList: View {
    
    // ⭐️ 6. adopt the observable object
    /// `modelData` property gets its value AUTOMATICALLY, as long as
    /// `environmentObject(_:)` modifier has been applied to a *parent*.
    @EnvironmentObject var modelData: ModelData
    
    var body: some View { ... }
}

📘 手冊

• SwiftUI Tutorials ⟩ Handling User Input ⟩

  • Sec. 4: Use an Observable Object for Storage

  • Sec. 5: Adopt the Model Object in Your Views

• Combine ⟩

  • ObservableObject

• SwiftUI ⟩ State and Data Flow

  • StateObject

  • ObservedObject

  • EnvironmentObject

📗 參考

• Majid ⟩ The difference between @StateObject, @EnvironmentObject, and @ObservedObject in SwiftUI #todo

💬 討論

• SwiftUI View not updating based on @ObservedObject

• @Published ObservedObjects SwiftUI Updates not Happening

問題

在跟 CS193P 到第三課的時候，如果按照課程上的程式碼原封不動的照抄，程式可以正常執行。

但如果擅自將 Card 這個 struct 改成不僅遵循 Identifiable 同時也遵循 Equatable，這時就出現問題了：「在按卡片的時候，卡片不會翻面」，這問題似乎跟 ForEach(data){ ... } 語法裡面，data 部分的 .id 有關係。

就算 @Published var viewModel 更新了，但在 ForEach(viewModel.cards) 裡面的 cards 的 id 並沒有變更，再加上 Card 本身遵循 Equatable (這點很重要，因為如果沒有 Equatable，程式可正常執行)，造成 SwiftUI 判斷 EmojiMemoryGameView 的 body 裡面的 ForEach 部分不需更新，因此就不會翻面了。

有 Equatable 跟沒有 Equatable 怎麼差那麼多呢？SwiftUI 是如何判斷一個 view 到底要不要更新呢？

參考資料

🍎 官方

• SwiftUI ⟩ View Layout & Presentation ⟩ ForEach

• Swift ⟩ Standard Library ⟩ Basic Behaviors ⟩ Identifiable

📘 參考

• Working with Identifiable items in SwiftUI - Hacking with Swift

• How to create views in a loop using ForEach - Hacking with Swift

• CS193P: Lecture 3, Reactive UI - YouTube