救命！我无法弄清楚！
为了帮助我学习SwiftUI，我使用列表视图制作了一个简单的杂货列表应用程序。轻触列表中的每个项目时，都有一些按钮变为绿色或红色。
在将太多项目添加到列表数组之前，下面的代码非常有用。如果列表长于屏幕尺寸，并且您必须滚动，那么奇怪的事情就会开始发生。（例如按钮不会变成绿色，或者下一页上的项目变成绿色）
我使用不同的模拟器进行了测试，在iPhone SE上，在混乱之前，它可以列出14个项目。在iPhone 11 Pro Max上，我可以在列表上找到22个项目，然后再开始弄乱。它与屏幕尺寸的长度以及是否需要滚动有关。
这是代码：
import SwiftUI
struct CheckboxFieldView : View {
@State var checkState:Bool = false ;
var body: some View {
Button(action:
{
self.checkState = !self.checkState
}) {
Rectangle()
.fill(self.checkState ? Color.green : Color.red)
.frame(width:20, height:20, alignment: .center)
.cornerRadius(5)
}
.foregroundColor(Color.white)
}
}
struct ContentView: View {
// let items = (1...100).map { number in "Item \(number)" }
let items = ["Bread", "Milk", "Cheese", "Granola", "Nuts", "Cereal", "Rosemary", "Tomato Sauce", "Bean with Bacon Soup", "Tea", "Chocolate Milk", "Frozen Blueberries", "Frozen Mixed Berries", "Frozen Strawberries", "Grapes"]
var body: some View {
NavigationView {
List(items, id: \.self) { item in
HStack{
CheckboxFieldView()
Text(item)
self.padding()
Text ("Location")
}
}.navigationBarTitle("Grocery List", displayMode: .inline)
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
好吧，在这种情况下，这是建模的问题...@State视图状态属性是一个视图状态，因此List为了优化和重用目的而缓存视图可以保留视图内部状态本身。因此，在这种情况下，状态不能用于持久性目的，并且需要具有显式视图模型，并且实际上对于所有模型情况都是如此。
这是修改后的演示代码，使用基于ObservableObject并@Binding用于视图间数据传递的视图模型，可以正常工作...
import SwiftUI
import Combine
// model to keep groceries
struct FoodItem: Identifiable {
var id = UUID().uuidString
var title: String
var checked = false
}
// view model part
class FoodViewModel: ObservableObject {
@Published var items = [FoodItem]()
}
struct CheckboxFieldView : View {
@Binding var item: FoodItem // bind to represented model
var body: some View {
Button(action:
{
self.item.checked.toggle()
}) {
Rectangle()
.fill(self.item.checked ? Color.green : Color.red)
.frame(width:20, height:20, alignment: .center)
.cornerRadius(5)
}
.foregroundColor(Color.white)
}
}
struct ContentView: View {
@ObservedObject private var viewModel = FoodViewModel()
let items = ["Bread", "Milk", "Cheese", "Granola", "Nuts", "Cereal", "Rosemary", "Tomato Sauce", "Bean with Bacon Soup", "Tea", "Chocolate Milk", "Frozen Blueberries", "Frozen Mixed Berries", "Frozen Strawberries", "Grapes"]
init() {
viewModel.items = items.map { FoodItem(title: $0) } // fill in demo model items
}
var body: some View {
NavigationView {
List(Array(viewModel.items.enumerated()), id: \.element.id) { (i, item) in
HStack{
CheckboxFieldView(item: self.$viewModel.items[i]) // bind to current item in view model
Text(item.title)
Spacer()
Text ("Location")
}
}.navigationBarTitle("Grocery List", displayMode: .inline)
}
}
}
struct TestListWithButtons_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句