假设我正在设计一个SwiftUI屏幕,要求用户输入用户名。该屏幕将进行一些检查以确保用户名有效。如果用户名无效,则会显示错误消息。如果用户点击“关闭”,它将隐藏错误消息。
最终,我可能会得到像这样的东西:
enum UsernameLookupResult: Equatable {
case success
case error(message: String, dismissed: Bool)
var isSuccess: Bool { return self == .success }
var isVisibleError: Bool {
if case .error(message: _, dismissed: false) = self {
return true
} else {
return false
}
}
var message: String {
switch self {
case .success:
return "That username is available."
case .error(message: let message, dismissed: _):
return message
}
}
}
enum NetworkManager {
static func checkAvailability(username: String) -> UsernameLookupResult {
if username.count < 5 {
return .error(message: "Username must be at least 5 characters long.", dismissed: false)
}
if username.contains(" ") {
return .error(message: "Username must not contain a space.", dismissed: false)
}
return .success
}
}
class Model: ObservableObject {
@Published var username = "" {
didSet {
usernameResult = NetworkManager.checkAvailability(username: username)
}
}
@Published var usernameResult: UsernameLookupResult = .error(message: "Enter a username.", dismissed: false)
func dismissUsernameResultError() {
switch usernameResult {
case .success:
break
case .error(message: let message, dismissed: _):
usernameResult = .error(message: message, dismissed: true)
}
}
}
struct ContentView: View {
@ObservedObject var model: Model
var body: some View {
VStack {
Form {
TextField("Username", text: $model.username)
Button("Submit", action: {}).disabled(!model.usernameResult.isSuccess)
}
Spacer()
if model.usernameResult.isSuccess || model.usernameResult.isVisibleError {
HStack(alignment: .top) {
Image(systemName: model.usernameResult.isSuccess ? "checkmark.circle" : "xmark.circle")
.foregroundColor(model.usernameResult.isSuccess ? Color.green : Color.red)
.padding(.top, 5)
Text(model.usernameResult.message)
Spacer()
if model.usernameResult.isSuccess {
EmptyView()
} else {
Button("Dismiss", action: { self.model.dismissUsernameResultError() })
}
}.padding()
} else {
EmptyView()
}
}
}
}
只需将我的“dismiss”操作设置为Button
,就可以轻松实现dismiss行为:Button("Dismiss", action: { self.model.dismissUsernameResultError() })
这将轻松显示错误信息并正确解除它们。
现在想象一下,我想使用一个不同的组件来调用解除方法。 此外,想象一下,我使用的组件仅接受 Binding (例如
Toggle )。 (注意:我意识到这不是一个理想的组件,但这是为了在这个简化的演示应用程序中说明)我可以尝试创建计算属性来抽象此行为,最终得到:
<code><code>@State private var bindableIsVisibleError: Bool {
get { return self.model.usernameResult.isVisibleError }
set { if !newValue { self.model.dismissUsernameResultError() } }
}
// ...
// replace Dismiss Button with:
Toggle(isOn: $bindableIsVisibleError, label: { EmptyView() })
</code></code>
... 然而,这不是有效的语法,并在
@State
行上产生以下错误:
属性包装器无法应用于计算属性
如何创建可绑定的计算属性?即具有自定义 getter 和 setter 的 Binding
。
虽然不太理想,因为它(A)仅提供了一个 setter,并且(B)添加了状态重复(这与 SwiftUI 的单一真相原则相抵触),我认为可以使用普通状态变量来解决此问题:
@State private var bindableIsVisibleError: Bool = true {
didSet { self.model.dismissUsernameResultError() }
}
然而这并不起作用,因为didSet
从未被调用。
set: { _ in }
。 - Asperiprivate(set)
。 - shimprivate(set)
? - Alexandre Gprivate(set) var foo: Bar
- shim