swiftui - 在 SwiftUI 中为 TextField 设置初始值 - 比较新旧值
问题描述
我已经看过很多关于如何使用空 TextField 来收集新值的示例和教程,但没有一个显示如何使用 TextField 来编辑值。
在我的用例中,我希望 TextField 预填充/预填充来自我的视图模型的数据,然后当用户编辑数据时,应该启用保存按钮。在我的表单中,我还有一个导航链接,它指向一个子页面,用户可以在该子页面中从列表中选择某些内容,然后将其路由回表单。
只要我使用一个空字段,它的行为就和描述的一样;用户可以在字段中输入一些临时的东西,导航到子页面,临时值仍然和他离开时一样。
struct TextFieldDemo: View {
var model:String // Actual a more complex view model
@State var editedValue:String = ""
var body: some View {
VStack(alignment: .leading, spacing: 20) {
Group{
Text("Some label")
TextField("Placeholder text", text: $editedValue)
}
Divider()
Text("Some navigation link to push in a page where " +
"the user can select something from a list and click back...")
// If the user starts to edit the textfield - follows a navigation link and comes back
// he should be able to continue edit the field where he left of - the text field should
// not have been reset to the original value.
Button(action: {
// Call some save function in the ViewModel
},label: {
Text("SAVE")
}
).disabled(model == editedValue)
}.onAppear(){
// I could have done something like:
// self.editedValue = model
// but it seems like this will fire if the user navigates into the described page and reset
// the TextField to the model value.
}
}
}
struct TextFieldDemo_Previews: PreviewProvider {
static var previews: some View {
TextFieldDemo(model: "The old value")
}
}
解决方案
要使用模型中的值初始化文本字段,您需要定义自己的初始化程序并使用vars的State(wrappedValue:)
初始化程序:@State
struct TextFieldDemo: View {
var model:String // Actual a more complex view model
@State var editedValue: String
init(model: String) {
self.model = model
self._editedValue = State(wrappedValue: model) // _editedValue is State<String>
}
var body: some View {
VStack(alignment: .leading, spacing: 20) {
Group{
Text("Some label")
TextField("Placeholder text", text: $editedValue)
}
Divider()
Text("Some navigation link to push in a page where " +
"the user can select something from a list and click back...")
// If the user starts to edit the textfield - follows a navigation link and comes back
// he should be able to continue edit the field where he left of - the text field should
// not have been reset to the original value.
Button(action: {
// Call some save function in the ViewModel
},label: {
Text("SAVE")
}
).disabled(model == editedValue)
}.onAppear(){
// I could have done something like:
// self.editedValue = model
// but it seems like this will fire if the user navigates into the described page and reset
// the TextField to the model value.
}
}
}
struct TextFieldDemo_Previews: PreviewProvider {
static var previews: some View {
TextFieldDemo(model: "The old value")
}
}
推荐阅读
- java - 如何使用 Eclipse Nebula Grid 在 Eclipse 插件中创建用户输入字段?
- c# - 如何将Task返回值分配给TPL C#中的某个变量
- sql - 关联表的外键
- python - 通过另一个索引或值过滤 DataFrame 索引
- r - 如何从直方图中找到 p 值
- amazon-lightsail - 在 AMI (Amazon) Linux 上安装和配置 Yara/phpmalwarefinder
- ruby-on-rails - Form_for 不将数据保存到数据库
- python - python中的一堆if/else语句被认为是人工智能吗?
- apache-beam - 如何使用 Apache Beam 创建滚动窗口?不是滑动的或固定的,而是一个滚动的窗口
- python - 使用 python 自动执行任务