如何在 SwiftUI 中根据特定条件来动态显示或隐藏表单的行?

21 min read

在 SwiftUI 中,我们可以使用 if-else 语句或三目运算符来根据特定条件来动态显示或隐藏表单的行。

例如,我们可以编写一个简单的表单添加一个 TextField 和一个 Toggle,当 Toggle 打开时,才显示 TextField:

struct ContentView: View {
    @State private var isShowingTextField = false
    @State private var textFieldText = ""

    var body: some View {
        Form {
            Toggle("Show TextField", isOn: $isShowingTextField)

            if isShowingTextField {
                TextField("Enter some text", text: $textFieldText)
            }
        }
        .navigationTitle("Dynamic Form")
    }
}

在这个例子中,我们使用一个 @State 属性 isShowingTextField 存储 Toggle 的选中状态,当它为 true 时,显示 TextField。注意到我们在 if 语句内使用了 TextField,当 Toggle 关闭时,TextField 会自动隐藏。

我们还可以使用三目运算符来完成相同的效果:

struct ContentView: View {
    @State private var isShowingTextField = false
    @State private var textFieldText = ""

    var body: some View {
        Form {
            Toggle("Show TextField", isOn: $isShowingTextField)

            isShowingTextField ? TextField("Enter some text", text: $textFieldText) : nil
        }
        .navigationTitle("Dynamic Form")
    }
}

这里,我们将 TextField 包含在一个三目运算符中,当 isShowingTextField 为 true 时,返回 TextField,否则返回 nil

无论使用 if-else 语句还是三目运算符,都可以根据需要动态显示或隐藏表单的行。