SwiftUI Combine：嵌套观察对象

Question

让 swiftUI 仍然根据嵌套观察对象进行更新的最佳方法是什么？

以下示例显示了我对嵌套观察对象的含义。球管理器的 balls 数组是一个已发布的属性，其中包含一个可观察对象数组，每个对象都有一个已发布的属性本身（颜色字符串）。

不幸的是，当点击其中一个球时，它不会更新球的名称，也不会收到更新。所以我可能搞砸了 combine 在那种情况下是如何工作的？

import SwiftUI

class Ball: Identifiable, ObservableObject {
    let id: UUID
    @Published var color: String
    init(ofColor color: String) {
        self.id = UUID()
       self.color = color
    }
}

class BallManager: ObservableObject {
    @Published var balls: [Ball]
    init() {
        self.balls = []
    }
}

struct Arena: View {
   @StateObject var bm = BallManager()

    var body: some View {
        VStack(spacing: 20) {
            ForEach(bm.balls) { ball in
                Text(ball.color)
                    .onTapGesture {
                        changeBall(ball)
                    }
            }
        }
        .onAppear(perform: createBalls)
        .onReceive(bm.$balls, perform: {
            print("ball update: \([=10=])")
        })
    }
    
    func createBalls() {
        for i in 1..<4 {
            bm.balls.append(Ball(ofColor: "c\(i)"))
        }
    }
    
    func changeBall(_ ball: Ball) {
        ball.color = "cx"
    }
}

Answer 1

当balls数组中的一个Ball改变时，可以调用objectWillChange.send()来更新ObservableObject。

以下应该适合您：

class BallManager: ObservableObject {
    @Published var balls: [Ball] {
        didSet { setCancellables() }
    }
    let ballPublisher = PassthroughSubject<Ball, Never>()
    private var cancellables = [AnyCancellable]()
    
    init() {
        self.balls = []
    }
    
    private func setCancellables() {
        cancellables = balls.map { ball in
            ball.objectWillChange.sink { [weak self] in
                guard let self = self else { return }
                self.objectWillChange.send()
                self.ballPublisher.send(ball)
            }
        }
    }
}

并通过以下方式进行更改：

.onReceive(bm.ballPublisher) { ball in
    print("ball update:", ball.id, ball.color)
}

注意：如果传入的初始值balls并不总是空数组，那么在init.

中也要调用setCancellables()

Answer 2

型号

Ball是一个模型，可以是一个struct，也可以是一个class（通常推荐使用struct，你可以找到更多信息here）

视图模型

通常您使用 ObservableObject 作为 ViewModel 或管理数据的组件。为球（模型）设置一个默认值通常很常见，因此您可以设置一个空数组。然后您可以使用来自数据库或存储的网络请求填充模型。

BallManager可以重命名为BallViewModel

BallViewModel 有一个函数可以根据 ForEach 组件中的索引更改底层模型。 id: \.self 基本上为当前索引渲染球（模型）。

建议的解决方案

以下更改将有助于实现您想要做的事情

struct Ball: Identifiable {
    let id: UUID
    var color: String
    init(ofColor color: String) {
        self.id = UUID()
        self.color = color
    }
}

class BallViewModel: ObservableObject {
    @Published var balls: [Ball] = []

    func changeBallColor(in index: Int, color: String) {
        balls[index] = Ball(ofColor: color)
    }
}

struct Arena: View {
   @StateObject var bm = BallViewModel()

    var body: some View {
        VStack(spacing: 20) {
            ForEach(bm.balls.indices, id: \.self) { index in
                Button(bm.balls[index].color) {
                    bm.changeBallColor(in: index, color: "cx")
                }
            }
        }
        .onAppear(perform: createBalls)
        .onReceive(bm.$balls, perform: {
            print("ball update: \([=10=])")
        })
    }

    func createBalls() {
        for i in 1..<4 {
            bm.balls.append(Ball(ofColor: "c\(i)"))
        }
    }
}

Answer 3

对于此示例，您不需要嵌套 ObserverObjects：

模型应该是一个简单的结构:

struct Ball: Identifiable {
    let id: UUID
    let color: String
    init(id: UUID = UUID(),
         color: String) {
        self.id = id
        self.color = color
    }
}

ViewModel 应处理所有逻辑，这就是为什么我将所有操作球的函数移至此处并将球数组设为私有集的原因。因为调用 changeBall 将数组中的一个结构替换为另一个 objectWillChange 被触发，视图被更新并且 onReceive 被触发。

class BallManager: ObservableObject {
    @Published private (set) var balls = [Ball]()
    
    func changeBall(_ ball: Ball) {
        guard let index = balls.firstIndex(where: { [=11=].id == ball.id }) else { return }
        balls[index] = Ball(id: ball.id, color: "cx")
    }
    
    func createBalls() {
        for i in 1..<4 {
            balls.append(Ball(color: "c\(i)"))
        }
    }
}

View 应该只将用户意图传达给 ViewModel：

struct Arena: View {

   @StateObject var ballManager = BallManager()

    var body: some View {
        VStack(spacing: 20) {
            ForEach(ballManager.balls) { ball in
                Text(ball.color)
                    .onTapGesture {
                        ballManager.changeBall(ball)
                    }
            }
        }
        .onAppear(perform: ballManager.createBalls)
        .onReceive(ballManager.$balls) {
            print("ball update: \([=12=])")
        }
    }
}

Answer 4

您只需创建一个 BallView 并观察它并从那里进行更改。你必须直接观察每个ObservableObject

struct Arena: View {
    @StateObject var bm = BallManager()
    
    var body: some View {
        VStack(spacing: 20) {
            ForEach(bm.balls) { ball in
                BallView(ball: ball)
            }
        }
        .onAppear(perform: createBalls)
        .onReceive(bm.$balls, perform: {
            print("ball update: \([=10=])")
        })
    }
    
    func createBalls() {
        for i in 1..<4 {
            bm.balls.append(Ball(ofColor: "c\(i)"))
        }
    }
    
    
}
struct BallView: View {
    @ObservedObject var ball: Ball
    
    var body: some View {
        Text(ball.color)
            .onTapGesture {
                changeBall(ball)
            }
    }
    func changeBall(_ ball: Ball) {
        ball.color = "cx"
    }
}

SwiftUI Combine：嵌套观察对象

SwiftUI Combine: Nested Observed-Objects

swift

swiftui

combine

observableobject

型号

视图模型

建议的解决方案