SWIFTUI 按钮登录认证和 go 到新视图

Question

I ned easy validation TextField after enter Email and password, next step push button, check Email and Password and go to next View. How it make? I have a some code State var and Button:

struct ContentView: View {

    @State var email = "1"
    @State var password = "1"

    Button(action: {
              if self.email == "1" && self.password == "1"{
              print("Button tapped")
              NextMyView()
              }else {
           print("error")
                            }
                        }) {
                            Image(systemName: "heart.fill")
                                .foregroundColor(.red)
                        }

But my idea dos not work, how I can make this validation and after push button go to next View.

Answer 1

You will need NavigationView and a NavigationLink to achieve what you're looking for.

NavigationView will wrap all the inner views within a navigation controller, and NavigationLink is like a special button that triggers the navigation.

Example:

struct ContentView: View {
  @State private var email: String = "root"
  @State private var password: String = "toor"
  
  @State private var isLoginValid: Bool = false
  @State private var shouldShowLoginAlert: Bool = false
  
  var body: some View {
    NavigationView {
      VStack(alignment: .center) {
        TextField("email", text: self.$email)
        TextField("password", text: self.$password)
        
        NavigationLink(destination: Text("Success"),
                       isActive: self.$isLoginValid) {
                /*
                 Here we put the content view of `NavigationLink`.
                 It could be any `View` even `Button` but in this
                 example we use a `Text` with `onTapGesture`.
                 */
                Text("Login")
                    .onTapGesture {
                    //determine login validity
                    let isLoginValid = self.email == "root" && self.password == "toor"
                    
                    //trigger logic
                    if isLoginValid {
                      self.isLoginValid = true //trigger NavigationLink
                    }
                    else {
                      self.shouldShowLoginAlert = true //trigger Alert
                    }
                }
        }
      }
      .navigationBarTitle("Login Screen")
      .alert(isPresented: $shouldShowLoginAlert) {
        Alert(title: Text("Email/Password incorrect"))
      }
    }
  }
}

NavigationLink defines:

1. destination which navigates to a simple Text view
   • In your case you should change it to NextMyView()
2. isActive binded to a boolean value loginSuccess which when updated to true shall re-render the view and cause NavigationLink to fire automatically
3. The content view is a simple Text with a onTapGesture in which we can implement the success/failure case handling.
   • In your case, you could change Text to Image(systemName: "heart.fill")

PS: As an extra, I included the logic to trigger and show an alert on login failure.
Hope it helps:)