如何使用 .reversed() 处理 SwiftUI 列表数组的 .onDelete

JS_*_*e18 4 arrays swift swiftui swiftui-list swiftui-navigationview

我正在尝试制作一个基本的 SwiftUI 列表,其中每个新列表项都显示在列表顶部。为此,我将 .reversed() 附加到传递到 ForEach 循环中的数组(由 表示)viewModel.itemList。我还设置了 .onDelete 来处理列表项的删除。但是,当我删除某个项目(例如列表中的最后一个项目)时,它会删除数组中的最后一个项目(列表顶部的项目)。如何配置 .onDelete 在数组反转时删除正确的项目?

请参阅下面的我的代码。谢谢!

内容视图

struct ContentView: View {
    
    @StateObject var viewModel = ToDoListViewModel()
    @State private var listItemName = ""
        
    var body: some View {
        NavigationView {
            VStack(alignment: .leading) {
                List {
                    ForEach(viewModel.itemList.reversed()) { item in
                        Text(item.listItem)
                    }.onDelete { index in
                        self.viewModel.itemList.remove(atOffsets: index)
                    }
                }
                
                HStack {
                    TextField("Enter List Item", text: $listItemName)

                    Button(action: {
                        viewModel.addToList(ToDoModel(listItem: listItemName))
                        listItemName = ""
                    }) {
                        Image(systemName: "plus")
                            .font(.largeTitle)
                            .frame(width: 75, height: 75)
                            .foregroundColor(Color.white)
                            .background(Color.blue)
                            .clipShape(Circle())
                    }
                }.frame(minWidth: 100, idealWidth: 150, maxWidth: 500, minHeight: 30, idealHeight: 40, maxHeight: 50, alignment: .leading)
                    .padding(.leading, 16)
                    .padding(.trailing, 16)
            }.navigationBarTitle("To Do List", displayMode: .inline)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
Run Code Online (Sandbox Code Playgroud)

模型

struct ToDoModel: Identifiable, Codable {
    var id = UUID()
    var listItem: String = ""
}
Run Code Online (Sandbox Code Playgroud)

视图模型

class ToDoListViewModel: ObservableObject {
    @Published var itemList = [ToDoModel]()

    func addToList( _ item: ToDoModel) {
        itemList.append(item)
    }
}
Run Code Online (Sandbox Code Playgroud)

wor*_*dog 5

你也可以尝试这种方法:

.onDelete { index in
    // get the item from the reversed list
    let theItem = viewModel.itemList.reversed()[index.first!]
    // get the index of the item from the viewModel, and remove it
    if let ndx = viewModel.itemList.firstIndex(of: theItem) {
        viewModel.itemList.remove(at: ndx)
    }
}
Run Code Online (Sandbox Code Playgroud)