@State Property Doesn't Change Its Value as Expected, until I add `onChange(of:)` Function

Question

import SwiftUI

struct ContentView: View {
    @State private var openSheet = false
    @State private var foo = 0
    
    var body: some View {
        Button {
            setFoo(100)
            openSheet = true
        } label: {
            Text("Open Sheet")
        }
        .padding()
        .frame(width: 400, height: 300, alignment: .center)
        .sheet(isPresented: $openSheet) {
            Text(String(foo))
                .padding()
                .frame(width: 200, height: 150, alignment: .center)
        }
    }
    
    private func setFoo(_ foo:Int) {
        self.foo = foo
    }
}

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

When above code ran, the result was "0" instead of "100". However, if I added ".onChange(of:)" function, result changed to "100".

import SwiftUI

struct ContentView: View {
    @State private var openSheet = false
    @State private var foo = 0
    
    var body: some View {
        Button {
            setFoo(100)
            openSheet = true
        } label: {
            Text("Open Sheet")
        }
        .padding()
        .frame(width: 400, height: 300, alignment: .center)
        .sheet(isPresented: $openSheet) {
            Text(String(foo))
                .padding()
                .frame(width: 200, height: 150, alignment: .center)
        }
        .onChange(of: openSheet) { newValue in
        }
    }
    
    private func setFoo(_ foo:Int) {
        self.foo = foo
    }
}

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

Any idea why this happens?

you could try using the `.sheet(item: ...)` version instead of the one you use. — workingdog support Ukraine, Apr 20 '22 at 10:17
Content of `.sheet(isPresented` is created once and do not observe dependencies, onChange just recreates it. Use `.sheet(item:` as recommended above, that variant allows to observe dependent item. [Here](https://stackoverflow.com/a/63948838/12299030) is a solution for a case similar to your. — Asperi, Apr 20 '22 at 11:12
I think the value inside the sheet is computed before the button is pressed and set to 100. I think the value is correct the second time you open the sheet. — Ptit Xav, Apr 20 '22 at 11:12

score 1 · Accepted Answer · answered Apr 20 '22 at 11:14

using one of the many @Asperi answers from here: Sheet inside ForEach doesn't loop over items SwiftUI

you could use something like this:

extension Int: Identifiable {
    public var id: Int { self }
}

struct ContentView: View {
    @State private var foo: Int?  // <-- here
    
    var body: some View {
        Button { setFoo(100) } label: { Text("Open Sheet") }
            .padding()
            .frame(width: 400, height: 300, alignment: .center)
            .sheet(item: $foo) { newFoo in    // <-- here
                Text(String(newFoo))
                    .padding()
                    .frame(width: 200, height: 150, alignment: .center)
            }
    }
    
    private func setFoo(_ foo:Int) {
        self.foo = foo
    }
}

@State Property Doesn't Change Its Value as Expected, until I add `onChange(of:)` Function

1 Answers1

Linked