登录屏幕SwiftUI

Question

我有登录的TextFields和密码的SecureField。如果我的登录和密码是正确的，我如何转到另一个视图？

struct LoginBoard: View {
@State private var login = "Tony"
@State private var password = "1234"

var body: some View {
    
    ZStack { 
        VStack {
            HStack {
                Text("Enter Login and Password")
            }

            HStack {
                Image(systemName: "person")
                TextField("Login", text: $login)
            }
            
            HStack {
                SecureField("Password", text: $password)
            }
            
            Button("Login") {
                   
            }
         }
      }
   }
}

Answer 1

您应该使用NavigationView (相当于UIKit中的导航控制器)，并使用NavigationLink作为导航的segue或触发器。

struct LoginBoard: View {
 
    @State private var login = "Tony"
    @State private var password = "1234"
    @State isLoginSuccess = false

    var body: some View {
    // like navigation controller 
    // that handles the navigation of views
 
        NavigationView { 
        // DestinationView is the view will go 
        // to if credentials is correct
            NavigationLink(destination: DestinationView(), 
                              isActive: $isLoginSuccess) { }
            ZStack { 
                VStack {
                    HStack {
                        Text("Enter Login and Password")
                    }
                    HStack {
                        Image(systemName: "person")
                        TextField("Login", text: $login)
                    }            
                    HStack {
                        SecureField("Password", text: $password)
                    }
                    Button("Login") {
                    // if user and password are correct change          
                    // isLoginSuccess to true and will navigate 
                    // to the next View 
                        isLoginSuccess = true
                    }
                }
            }
        }
    }
}

Answer 2

将堆栈包装在NavigationView{}中，并使用NavigationLink{}指向另一个视图。示例代码如下：

import SwiftUI

struct LoginBoard: View { 

    @State private var login = "Tony"
    @State private var password = "1234"

    var body: some View {
        NavigationView {
            ZStack {
                VStack {
                    HStack {
                        Text("Enter Login and Password")
                    }
                    HStack {
                        Image(systemName: "person")
                        TextField("Login", text: $login)
                    }              
                    HStack {
                        SecureField("Password", text: $password)
                    }
                    NavigationLink {
                        WelcomeView()
                    } label: {
                        Text("Login")
                            .foregroundColor(.blue)
                    }
                    .disabled((login == "Tony" && 
                               password == "1234") ? false : true)
                }
            }
        }
    }
}

struct WelcomeView: View {
    var body: some View {
        Text("welcome!")
    }
}