NavigationView 中的多個文本字段視圖未將輸入綁定到 ViewModel

Question

我有一個 NavigationView，其中有 4 個不同的視圖通過 NavigationLinks 推送到堆棧上。

每個視圖都有一個 TextField，其輸入是 $binded 到 ViewModel 中的一個屬性。

當我輸入文本並將新視圖推送到堆棧時，輸入未綁定/保存到 ViewModel。 我知道這一點是因為我嘗試打印出先前輸入的文本或在下一個視圖中顯示先前輸入的文本。

我究竟做錯了什么？

這是我的代碼...

class SignupNavigationViewModel: ObservableObject {
    
      var email = ""
      var username = ""
      var password = ""
      var reconfirmPassword = ""
}

// first view
struct SignupEmailView: View {
    @ObservedObject var signupNavigationViewModel = SignupNavigationViewModel()

    var body: some View {
        NavigationView {
            VStack {
                HStack {
                    TextField("enter your e-mail", text: $signupNavigationViewModel.email )
                }
                NavigationLink("continue", destination: ConfirmCodeView())
                Spacer()
               
            }
        }
     }
  }

// second view
struct ConfirmCodeView: View {
    @ObservedObject var signupNavigationViewModel = SignupNavigationViewModel()
   
    var body: some View {
        
            VStack {
            TextField("Enter code sent to your email", text: $signupNavigationViewModel.emailCode)
            NavigationLink("confirm", destination: SignupUsername() )
            }.navigationBarBackButtonHidden(true)
     }  
}

  //etc..

Answer 1

您需要將相同的SignupNavigationViewModel實例傳遞給下一個視圖。 現在，它正在完全創建一個新實例。

class SignupNavigationViewModel: ObservableObject {
    @Published var email = ""
    @Published var username = ""
    @Published var password = ""
    @Published var reconfirmPassword = ""
}

// first view
struct ContentView: View {
    @ObservedObject var signupNavigationViewModel = SignupNavigationViewModel()
    
    var body: some View {
        NavigationView {
            VStack {
                HStack {
                    TextField("enter your e-mail", text: $signupNavigationViewModel.email )
                }
                NavigationLink("continue", destination: ConfirmCodeView(signupNavigationViewModel: signupNavigationViewModel)) //<-- Here
                Spacer()
                
            }
        }
    }
}

// second view
struct ConfirmCodeView: View {
    @ObservedObject var signupNavigationViewModel : SignupNavigationViewModel //<-- Here
    
    var body: some View {
        
        VStack {
            Text("Email: \(signupNavigationViewModel.email)")
            TextField("Enter code sent to your email", text: $signupNavigationViewModel.emailCode)
            NavigationLink("confirm", destination: Text("Destination") )
        }.navigationBarBackButtonHidden(true)
    }
}

這樣，他們共享相同的數據。 請注意，我還將您的視圖 model 屬性更改為@Published ，以便在值更改時視圖將動態響應它們。