SwiftUI 将保存的值传递给父 View

Question

我对 SwiftUI 相当陌生，我正在尝试找出将数据从 subview 传递到父 View 的最佳方法？

感谢您的帮助，我来自 Javascript (React) 背景，所以这对我来说有点不同

我的 subview 的工作方式是用户单击图像来选择该图像。

我有@State绑定(bind)来保存imgUrl，它是一个引用 Assets 中名称的字符串。

我只是不确定将该值传递给父组件的最佳方法。

这是 subview (imageSelector)

struct ImageSelector: View {
    @State private var windowImgs = ["1", "2", "3","4","5","6","7","8","9","10","11","12","13", "14","15","16","17","18"]
    
    @State private var imgPicked = ""
    
    var body: some View{
        ScrollView(Axis.Set.horizontal, showsIndicators: true){
            HStack{
                ForEach(0..<18){num in
                    Button(action:{
                        self.imgPicked = self.windowImgs[num]
                        print(self.imgPicked)
                    }){
                        Image("\(self.windowImgs[num])")
                            .renderingMode(.original)
                            .resizable()
                            .cornerRadius(4)
                            .frame(width: 100, height: 100)
                    }
                }
            }
        }
    }
}

这是父 View (AddCounterForm)

struct AddCounterForm: View {
    @Environment(\.presentationMode) var presentationMode
    @State private var pickedImg: String = "defaultImg"
    @State private var price: String = "0.0"
    @State private var qty: String = "0"
    var body: some View {
        VStack (spacing: 40){
            HStack {
                Button("Cancel"){
                    self.presentationMode.wrappedValue.dismiss()
                }
                .foregroundColor(.red)
                Spacer()
                Button("Save"){
                    
                }
            }
            HStack {
                VStack (spacing: 20){
                    TextField("Window type", text: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Value@*/.constant("")/*@END_MENU_TOKEN@*/)
                    TextField("Window location", text: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Value@*/.constant("")/*@END_MENU_TOKEN@*/)
                }
                .textFieldStyle(RoundedBorderTextFieldStyle())
                Image(pickedImg)
                    .resizable()
                    .cornerRadius(4)
                    .frame(width: 90, height: 90)
                    .padding(.leading)
            }
            
            HStack {
                Text("Price")
                TextField("", text:$price)
                    .frame(width: 70)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .keyboardType(.numberPad)
                Spacer()
                Text("Qty")
                TextField("", text:$qty)
                    .frame(width: 70)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .keyboardType(.numberPad)
            }
            VStack {
                Text("Select an image")
                    .foregroundColor(.blue)
                ImageSelector()
                    .padding(.bottom)
                
                Button("Use your own image"){
                    //method
                }
                .frame(width: 180, height: 40)
                .background(Color.blue)
                .clipShape(Capsule())
                .foregroundColor(.white)
                .padding(.top)
            }
            
        }
        .padding()
    }
}

预览解决方案感谢 @Asperi 和 @neverwinterMoon 的帮助

struct ImageSelector_Previews: PreviewProvider {
    static var previews: some View {
        PreviewWrapper()
    }
}

---

struct PreviewWrapper: View {
    @State(initialValue: "") var imgPicked: String
    
    var body: some View {
        ImageSelector(imgPicked: $imgPicked)
    }
}

Answer 1

在这种情况下 Binding 是最合适的

struct ImageSelector: View {
   @Binding var imgPicked: String

并使用

ImageSelector(imgPicked: $pickedImg)
    .padding(.bottom)