SwiftUI技术问题：点击按钮后无法更新重绘图片，求排查方案

你的代码里有两个核心问题导致图片无法随状态更新：

1. ObservableObject的存储方式错误 #

CloudImage是遵循ObservableObject的引用类型，不能用@State来存储。@State仅适用于值类型（比如String、Int、结构体），无法监听引用类型中@Published属性的变化。正确的做法是使用@StateObject（iOS 14及以上版本推荐）或@ObservedObject。

2. 可选优化：按钮逻辑冗余 #

TextField已经直接绑定了$image.url，输入内容时url会自动同步更新，按钮的changeUrl方法属于重复赋值，完全可以去掉；如果要保留按钮，也无需额外的赋值逻辑。

修复后的完整代码 #

import SwiftUI

class CloudImage: ObservableObject {
    @Published var url = "black"
    
    // 可选：保留按钮逻辑的话可以保留此方法，但实际无必要重复赋值
    func changeUrl(name: String){
        self.url = name
        print(self.url)
    }
}

struct ContentView: View {
    // 将@State替换为@StateObject，监听ObservableObject的状态变化
    @StateObject var image = CloudImage()
    
    var body: some View {
        Text("Change Image Test")
            .padding()
        
        ImageContainer(image_name: image.url)
            
        VStack {
            TextField("Image", text: $image.url)
                .disableAutocorrection(true)
                .textInputAutocapitalization(.never)
    
            Button("Update"){
                image.changeUrl(name: image.url)
            }
            .buttonStyle(.borderedProminent)
        }
    }
}

struct ImageContainer: View {
    var image_name: String = ""
    
    var body: some View {
        Image(image_name)
            // 可选：给图片添加固定尺寸，避免布局混乱
            .frame(width: 100, height: 100)
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

关键修复说明 #

• 替换@State为@StateObject后，SwiftUI会自动监听CloudImage中@Published属性的变化，触发视图重绘，图片就能随输入内容切换了。
• 若需兼容iOS 13，可改用@ObservedObject，并在ContentView初始化方法中创建实例：

struct ContentView: View {
    @ObservedObject var image: CloudImage
    
    init() {
        self.image = CloudImage()
    }
    
    // 后续代码不变
}

确保你的Assets目录中存在名为black、orange、gray的图片资源，现在输入对应名称，图片就会自动更新。

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