SwiftUI中如何让父视图控制子视图独立保留或放弃编辑值？

核心思路是使用临时编辑副本：让子视图操作原数据的副本，点击确定时将副本同步回原数据，点击取消则直接丢弃副本，完全符合SwiftUI的响应式数据流逻辑，同时保证子视图的复用性。

方案一：ViewModel为类（ObservableObject） #

1. 改造ViewModel，支持创建编辑副本 #

class ServerViewModel: ObservableObject {
    @Published var address: String
    @Published var port: String
    
    init(address: String, port: String) {
        self.address = address
        self.port = port
    }
    
    // 创建当前实例的副本，用于编辑
    func createEditCopy() -> ServerViewModel {
        ServerViewModel(address: address, port: port)
    }
}

2. 简化子视图，直接绑定临时副本 #

子视图不再需要自己维护@State变量，直接接收临时编辑模型作为数据源：

struct ServerEditView: View {
    @ObservedObject var editModel: ServerViewModel
    
    var body: some View {
        VStack {
            Text("Enter the server address and port")
                .font(.title)
            HStack {
                Text("Address:")
                TextField("Address", text: $editModel.address)
                    .textContentType(.URL)
                Text("Port:")
                TextField("Port", text: $editModel.port)
                    .keyboardType(.numberPad)
            }
            .padding()
        }
    }
}

3. 容器视图处理保存/取消逻辑 #

在容器中维护临时编辑模型，确定时同步到原模型，取消时直接销毁副本：

struct ContainerView: View {
    @ObservedObject var originalModel: ServerViewModel
    @State private var isSheetPresented = false
    @State private var tempEditModel: ServerViewModel?
    
    var body: some View {
        Button("Open Settings") {
            // 弹出Sheet前创建原模型的副本
            tempEditModel = originalModel.createEditCopy()
            isSheetPresented = true
        }
        .sheet(isPresented: $isSheetPresented) {
            VStack {
                if let editModel = tempEditModel {
                    ServerEditView(editModel: editModel)
                }
                
                HStack {
                    Spacer()
                    Button("Cancel") {
                        isSheetPresented.toggle()
                    }
                    Button("Ok") {
                        // 同步临时副本到原模型
                        if let editModel = tempEditModel {
                            originalModel.address = editModel.address
                            originalModel.port = editModel.port
                        }
                        isSheetPresented.toggle()
                    }
                    .buttonStyle(.borderedProminent)
                }
                .padding()
            }
        }
    }
}

方案二：ViewModel为结构体（值类型） #

如果ViewModel是值类型，处理会更简洁，利用值类型的天然复制特性：

1. 定义值类型ViewModel #

struct ServerModel {
    var address: String
    var port: String
}

2. 子视图用Binding绑定临时模型 #

struct ServerEditView: View {
    @Binding var editModel: ServerModel
    
    var body: some View {
        // 布局和方案一完全一致，直接绑定$editModel的属性
        VStack {
            Text("Enter the server address and port")
                .font(.title)
            HStack {
                Text("Address:")
                TextField("Address", text: $editModel.address)
                    .textContentType(.URL)
                Text("Port:")
                TextField("Port", text: $editModel.port)
                    .keyboardType(.numberPad)
            }
            .padding()
        }
    }
}

3. 容器视图逻辑 #

struct ContainerView: View {
    @State var originalModel: ServerModel
    @State private var isSheetPresented = false
    @State private var tempEditModel: ServerModel?
    
    var body: some View {
        Button("Open Settings") {
            // 值类型直接复制
            tempEditModel = originalModel
            isSheetPresented = true
        }
        .sheet(isPresented: $isSheetPresented) {
            VStack {
                if let editModel = $tempEditModel {
                    ServerEditView(editModel: editModel)
                }
                
                HStack {
                    Spacer()
                    Button("Cancel") {
                        isSheetPresented.toggle()
                    }
                    Button("Ok") {
                        // 直接赋值替换原模型
                        if let editModel = tempEditModel {
                            originalModel = editModel
                        }
                        isSheetPresented.toggle()
                    }
                    .buttonStyle(.borderedProminent)
                }
                .padding()
            }
        }
    }
}

方案优势 #

• 完全遵循SwiftUI响应式数据流，没有复杂的回调、协议转换或类型擦除问题
• 取消操作无需额外重置逻辑，直接丢弃临时副本即可
• 子视图仅负责编辑逻辑，不依赖外部按钮，复用性不受影响
• 逻辑清晰，维护成本低，是SwiftUI处理此类场景的标准模式

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