SwiftUI中State关联类属性更新后视图不刷新的问题

问题背景 #

开发iPhone端SwiftUI应用时，通过await loadData()从URL加载产品数据存入@State变量products。遇到以下问题：

• 直接修改类属性product.count时，控制台显示计数器已更新，但列表中数值始终为0；
• 新增@State变量pCount作为映射存储计数，能正常显示，但方案不够理想；
• 尝试将Product类声明为ObservableObject并使用StateObject，但需要将func loadData() async {}改为可变方法，导致编译失败。

核心疑问：是否因使用类属性导致列表计数器不更新？

相关代码 #

PurchaseView视图代码 #

struct PurchaseView: View {
    @State private var products: [Product] = []
    @State private var pCount: [String: Int] = [:]
    
    var body: some View {
        NavigationStack {
            List {
                ForEach(products) { product in
                    VStack(alignment: .leading) {
                        let p = Double(product.price)!

                        let plusButton = Button() {} label: {
                            Image(systemName: "plus.circle.fill").symbolRenderingMode(.multicolor)
                        }
                        .onTapGesture {
                            //product.count += 1 <-- 首次尝试，计数器不更新
                            pCount[product.id]! += 1
                            product.count = pCount[product.id]!
                            purchaseButtonText = formatPurchaseButtonText(sum: pSum)
                        }

                        let minusButton = Button() {} label: {
                            Image(systemName: "minus.circle.fill").symbolRenderingMode(.multicolor)
                        }
                        .onTapGesture {
                            //product.count -= 1 <-- 首次尝试，计数器不更新
                            pCount[product.id]! -= 1
                            product.count = pCount[product.id]!
                            purchaseButtonText = formatPurchaseButtonText(sum: pSum)
                        }

                        HStack {
                            Text("\(product.name), \(p, specifier: "%.0f")").font(.headline)
                            minusButton.frame(maxWidth: .infinity, alignment: .trailing)
                            //Text("\(product.count)") <-- 首次尝试，计数器不更新
                            Text("\(pCount[product.id] ?? 0)")
                            plusButton
                        }
                    }
                }
            }
            .navigationTitle("Purchase")
        }
        .task {
            await loadData()
        }
    }
}

辅助方法与模型代码 #

func loadData() async {
    // 从URL获取JSON数据
    for result in products {
        if pCount[result.id] == nil {
            pCount[result.id] = result.count
        }
    }
}

class Product: Identifiable, Codable {
    var id: String = ""
    var name: String = ""
    var price: String = ""
    var count: Int = 0
}

JSON示例数据 #

[
  {
    "id": "6626e52f-34cc-4e3a-a244-60598a754ba4",
    "name": "soda",
    "price": "2.000",
    "count": 0
  }
]

产品列表截图 #

问题原因 #

是的，直接修改类属性不会触发视图更新，核心原因是：
SwiftUI的@State仅监听值类型的整体变化，而Product是引用类型（class）。修改类的属性时，products数组中存储的只是对象的引用，引用本身没有改变，因此@State不会触发视图刷新。控制台能看到count变化是因为内存中的对象确实被修改了，但视图没有收到更新通知。

解决方案 #

方案1：将Product改为值类型（struct） #

这是最贴合SwiftUI设计哲学的方案，值类型的属性变化会让整个值被视为新对象，@State会自动检测到变化并刷新视图。

修改Product定义：

struct Product: Identifiable, Codable {
    var id: String = ""
    var name: String = ""
    var price: String = ""
    var count: Int = 0
}

修改按钮点击逻辑，直接更新数组中的对应元素：

// 加号按钮点击逻辑
.onTapGesture {
    guard let index = products.firstIndex(where: { $0.id == product.id }) else { return }
    products[index].count += 1
    purchaseButtonText = formatPurchaseButtonText(sum: pSum)
}

// 减号按钮点击逻辑
.onTapGesture {
    guard let index = products.firstIndex(where: { $0.id == product.id }) else { return }
    // 防止count变为负数
    if products[index].count > 0 {
        products[index].count -= 1
        purchaseButtonText = formatPurchaseButtonText(sum: pSum)
    }
}

之后直接使用Text("\(product.count)")即可显示计数器，无需额外维护pCount字典。

方案2：保留class并使用ObservableObject #

如果必须使用class，需要让Product遵循ObservableObject，并用@Published标记count属性，让其变化能被SwiftUI监听：

修改Product定义：

class Product: Identifiable, Codable, ObservableObject {
    var id: String = ""
    var name: String = ""
    var price: String = ""
    @Published var count: Int = 0
    
    // 手动实现Codable，因为ObservableObject会导致自动合成失败
    enum CodingKeys: String, CodingKey {
        case id, name, price, count
    }
    
    required init(from decoder: Decoder) throws {
        let container = try decoder.container(keyedBy: CodingKeys.self)
        id = try container.decode(String.self, forKey: .id)
        name = try container.decode(String.self, forKey: .name)
        price = try container.decode(String.self, forKey: .price)
        count = try container.decode(Int.self, forKey: .count)
    }
    
    func encode(to encoder: Encoder) throws {
        var container = encoder.container(keyedBy: CodingKeys.self)
        try container.encode(id, forKey: .id)
        try container.encode(name, forKey: .name)
        try container.encode(price, forKey: .price)
        try container.encode(count, forKey: .count)
    }
    
    // 空初始化器
    init() {}
}

</think_never_used_51bce0c785ca2f68081bfa7d91973934>
在视图中，需要用ObservedObject监听每个Product的变化，这里需要自定义一个包装器解决ForEach中的监听问题：

// 自定义包装器，用于在ForEach中监听单个ObservableObject
struct ObservedObjectWrapper<T: ObservableObject>: View {
    @ObservedObject var product: T
    var content: (T) -> View
    
    init(product: T, @ViewBuilder content: @escaping (T) -> View) {
        self.product = product
        self.content = content
    }
    
    var body: some View {
        content(product)
    }
}

修改ForEach部分代码：

ForEach(products) { product in
    ObservedObjectWrapper(product: product) { wrappedProduct in
        VStack(alignment: .leading) {
            let p = Double(wrappedProduct.price)!
            
            let plusButton = Button() {} label: {
                Image(systemName: "plus.circle.fill").symbolRenderingMode(.multicolor)
            }
            .onTapGesture {
                wrappedProduct.count += 1
                purchaseButtonText = formatPurchaseButtonText(sum: pSum)
            }
            
            let minusButton = Button() {} label: {
                Image(systemName: "minus.circle.fill").symbolRenderingMode(.multicolor)
            }
            .onTapGesture {
                if wrappedProduct.count > 0 {
                    wrappedProduct.count -= 1
                    purchaseButtonText = formatPurchaseButtonText(sum: pSum)
                }
            }
            
            HStack {
                Text("\(wrappedProduct.name), \(p, specifier: "%.0f")").font(.headline)
                minusButton.frame(maxWidth: .infinity, alignment: .trailing)
                Text("\(wrappedProduct.count)")
                plusButton
            }
        }
    }
}

这种方案需要手动实现Codable，相对复杂，仅在必须使用class的场景下推荐。

总结 #

优先选择值类型struct的方案，代码更简洁，符合SwiftUI的响应式设计逻辑，无需额外处理ObservableObject的复杂细节。

内容的提问来源于stack exchange，提问作者kometen