Textfield toggling Bool when clicked - swift

Question

I have a Bool value titled editMode which determines if the user can edit information on a current page. When this is toggled true and I enter a textfield, the Bool is flipped back to false. This only occurs on the first click into the textfield. On subsequent clicks into the textfield, it does not toggle (working fine)
How can I fix this issue?
struct RecipeControllerModal: View {
#Environment(\.dismiss) var dismiss // << dismiss view
#ObservedObject var rm = RecipeLogic()
#ObservedObject var ema = EditModeActive() // calling in next view
var body: some View {
NavigationView{
VStack{
VStack{
RecipeDashHeader(ema: ema) // <<passing editMode
.padding()
}
}
}
RecipeDashHeader // <<textfield view
struct RecipeDashHeader: View {
#State var recipeName = ""
#ObservedObject var ema: EditModeActive
#ViewBuilder
var body: some View {
if ema.editMode {
VStack{
TextField(recipeName, text: $recipeName)
.foregroundColor(!ema.editMode ? Color.black : Color.red)
.font(.title2)
.multilineTextAlignment(.center)
.padding()
.onChange(of: recipeName, perform: { _ in
ema.recipeTitle = recipeName
})
}
Published EditMode Variable
class EditModeActive: ObservableObject {
#Published var editMode: Bool = false
#Published var recipeTitle = ""
}

Answer 1

Try this approach using the ema.recipeTitle directly in your TextField and
using #StateObject var ema as mentioned in the comments.
Here is the example code I used in my tests:
struct ContentView: View {
var body: some View {
RecipeControllerModal()
}
}
struct RecipeControllerModal: View {
#Environment(\.dismiss) var dismiss // << dismiss view
// #ObservedObject var rm = RecipeLogic() // for testing
#StateObject var ema = EditModeActive() // <-- here
var body: some View {
NavigationView{ // <-- here should use NavigationStack
VStack{
VStack{
RecipeDashHeader(ema: ema) // <<passing editMode
.padding()
}
// for testing
Button(ema.editMode ? "save" : "edit") {
ema.editMode.toggle()
}
}
}
}
}
struct RecipeDashHeader: View {
// #State var recipeName = "" // <-- here not needed
#ObservedObject var ema: EditModeActive
var body: some View {
if ema.editMode {
VStack{
TextField(ema.recipeTitle, text: $ema.recipeTitle) // <-- here
.foregroundColor(!ema.editMode ? Color.black : Color.red) // <--- usesless here ema.editMode == true always
.font(.title2)
.multilineTextAlignment(.center)
.padding()
.border(.red)
// not needed
// .onChange(of: ema.recipeTitle, perform: { name in
// ema.recipeTitle = name
// })
}
} else {
Text(ema.recipeTitle)
}
}
}
class EditModeActive: ObservableObject {
#Published var editMode: Bool = false
#Published var recipeTitle: String = "recipe title" // <-- here
}