如何解决如何修复在 ForEach 循环中不可点击的按钮?
我有一个包含按钮的视图。带有按钮的视图是从 forEach 循环创建的。出于某种原因,只有某些按钮可以点击,而其他按钮则不能。
父视图包含 NavigationView、NavigationView 内部的滚动视图、滚动视图内部的 lazyvstack、lazyvstack 中的 forEachloop,在该 for 循环中是包含按钮的子视图。
struct ContentView: View {
let peoples:[Person] = Bundle.main.decode("data.json")
var body: some View {
let columns = [
GridItem(.flexible(minimum: 300),spacing: 10)
]
NavigationView {
ScrollView(.vertical) {
Lazyvstack {
ForEach(peoples,id: \.self) { person in
PersonView(name: person.Name,age: person.Age)
}
}
.navigationTitle("A list of people")
.navigationViewStyle(DefaultNavigationViewStyle())
.padding()
}
}
}
}
子视图如下。我怀疑滚动视图正在窃取用户输入,但我不确定为什么或如何克服它。有些按钮是可贴胶带的,有些则不是。
struct PersonView: View {
@Environment(\.colorScheme) var colorScheme
var name: String
var age: Int
var body: some View {
vstack(alignment:.leading) {
Image("randoPerson")
.resizable()
.scaledToFill()
.frame(minWidth: nil,idealWidth: nil,maxWidth: UIScreen.main.bounds.width,minHeight: nil,idealHeight: nil,maxHeight: 300,alignment: .center)
.clipped()
vstack(alignment: .leading,spacing: 6) {
Text("name")
.fontWeight(.heavy)
.padding(.leading)
Text("Age \(age)")
.foregroundColor(Color.gray)
.padding([.leading,.bottom])
Button(action: { print("I was tapped") }) {
HStack {
Image(systemName: "message.fill")
.font(.title)
.foregroundColor(.white)
.padding(.leading)
Text("Message them")
.font(.subheadline)
.foregroundColor(.white)
.padding()
}
.background(Color.blue)
}
.padding()
}
.background(Color(UIColor.systemBackground).cornerRadius(15))
.shadow(color:colorScheme == .dark
? Color.white.opacity(0.2)
: Color.black.opacity(0.2),radius: 7,x: 0,y: 2)
}
}
}
解决方法
要解决此问题,您可以添加一个与 id: UUID
关联的 Person
,并使用其 ID 在 Person
内的 ForEach
之间进行迭代。
您还会注意到我将值添加为小写字母以遵守 Swift 约定。
struct Person {
let id: UUID // Add this value
var name: String
var age: Int
}
所以这里是用 id
替换 \.self
的 ContentView:
struct ContentView: View {
let peoples: [Person] = Bundle.main.decode("data.json")
var body: some View {
NavigationView {
ScrollView(.vertical) {
LazyVStack {
ForEach(peoples,id: \.id) { person in // id replace \.self here
PersonView(name: person.name,age: person.age) // removed uppercase
}
}
.navigationTitle("A list of people")
.navigationViewStyle(DefaultNavigationViewStyle())
.padding()
}
}
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。