3

I would like to pass a variable from a parent to a child view, but in this child view, use it in a text field but update this value only when a SAVE button is pressed.

I tried this:

ParentView

struct ParentView: View {
    @State private var name: String = ""
    
    var body: some View {
        HStack {
            Text("User name: \(name)")
            Spacer()
            NavigationLink(
                destination: ChildView(name: name),
                label: {
                    Text("Update name")
                }
            )
        }
    }
}

ChildView

struct ChildView: View {
    @State private var name: String = ""
    @Binding var passedName: String
    
    var body: some View {
        VStack {
            Form {
                TextField("Update name", text: $name)
                Button(action: {
                    passedName = name
                }, label: {
                    Text("SAVE")
                })
            }
        }
    }
    
    init(name: String) {
        self._passedName = .constant(name)
        self.name = name
    }        
}

Since I don't want to update the variable directly, I tried to use a name value and then only set the value of the binded passedName when the OK button is tapped. But it doesn't work.

I don't know how to do what I want to.

Thank you for your help

Another Dude
  • 1,204
  • 4
  • 15
  • 33

1 Answers1

7

Your general approach is correct - have a state variable to represent a temporarily typed name, but a binding to represent the name "returned" to the parent.

Because the child modifies the data owned by the parent, it needs to accept a binding - not a plain String:

struct ChildView: View {
    @State private var name: String
    @Binding var passedName: String
    
    var body: some View {
        VStack {
            Form {
                TextField("Update name", text: $name)
                Button(action: {
                    passedName = name
                }, label: {
                    Text("SAVE")
                })
            }
        }
    }

    init(name: Binding<String>) {
        self._passedName = name
        self._name = State(initialValue: name.wrappedValue)
    }
}

Then, pass in a binding from the parent:

ChildView(name: $name)
New Dev
  • 48,427
  • 12
  • 87
  • 129
  • 2
    Almost... you still need init to give `tempName` initial value from `name`. – Asperi Oct 25 '20 at 17:21
  • 1
    @Asperi, I thought about that, but in the OP's question he just set it to `""`, so I didn't want to add my own interpretation. EDIT: Never mind.. he did attempt to change it in `init`... Will update the answer – New Dev Oct 25 '20 at 17:24
  • Thank you very much, I got it working and understood. Could you also explain me why I need to initialize `_name` with `State(initialValue: name.wrappedValue)` instead of only `self.name = name.wrappedValue` in ChildView's `init?` What's the difference? – Another Dude Oct 25 '20 at 18:00
  • @AnotherDude, that would result in `Variable 'self.name' used before being initialized`, and if you initialize it with `""`, then it would overwrite `name.wrappedValue` set in `init`... give it a try – New Dev Oct 25 '20 at 18:03
  • Thank you again. I think I'll ask a separate question about this because I still need some insight - declarative programming and state are still an obscure thing to me. – Another Dude Oct 25 '20 at 18:12