ios – Flawed merchandise will get deleted from LazyVGrid

My purpose is to create a listing like this in SwiftUI

Each time the consumer faucets add, a brand new row is created after which on swiping to delete, the respective row must be deleted.

To be able to do this, I begin with a really primary mannequin

struct SnagItem: Codable {
    personal(set) var reference: Int = 0
    personal(set) var particulars: String = ""
    personal(set) var isCompleted: Bool = false
    
    enum CodingKeys: String, CodingKey, CaseIterable {
        case reference = "Reference"
        case particulars = "Particulars"
        case isCompleted = "IsCompleted"
    }
}

extension SnagItem: Hashable { }

I take advantage of this mannequin inside a view mannequin which I want to bind to my SwiftUI view, that is the view mannequin:

class SnagItemViewModel: ObservableObject {
    personal let snagItem: SnagItem
    
    @Printed var particulars: String = ""
    @Printed var isCompleted: Bool = false
    
    init(withSnagItem snagItem: SnagItem) {
        self.snagItem = snagItem
        particulars = snagItem.particulars
        isCompleted = snagItem.isCompleted
    }
}

I’ve one other view mannequin that retains observe of all of the snag objects (rows) utilizing an array. This additionally handles the including and deletion of things.

class SnagItemsViewModel: ObservableObject {
    @Printed var snagItems: [SnagItemViewModel] = [SnagItemViewModel(withSnagItem: SnagItem())]
    
    func getSnagItem(at index: Int) -> SnagItemViewModel {
        snagItems[index]
    }
    
    func addSnagItem() {
        snagItems.append(SnagItemViewModel(withSnagItem: SnagItem()))
    }
    
    func deleteSnagItemRecord(at indexSet: IndexSet) {
        guard let index = indexSet.first else { return }
        snagItems.take away(at: index)
    }
}

@Printed var snagItems: [SnagItemViewModel] = [SnagItemViewModel(withSnagItem: SnagItem())]

I’ve created a SwiftUI view that acts as a container:

struct SnagItemsView: View {
    @StateObject var snagItemsViewModel: SnagItemsViewModel
    
    var physique: some View {
        ForEach(0 ..< snagItemsViewModel.snagItems.rely, id: .self) { snagItemIndex in
            let snagItemViewModel = snagItemsViewModel.getSnagItem(at: snagItemIndex)
            
            SnagItemRowView(reference: snagItemIndex + 1,
                            snagItemViewModel: snagItemViewModel)
        }
        .onDelete(carry out: delete(at:))
    }
    
    func delete(at indexSet: IndexSet) {
        withAnimation {
            snagItemsViewModel.deleteSnagItemRecord(at: indexSet)
        }
    }
}

Every row then has it is personal view:

struct SnagItemRowView: View {
    @State var reference: Int
    @StateObject var snagItemViewModel: SnagItemViewModel
    
    let gridItemColumnConfig = [
        GridItem(.fixed(Constants.Frame.minGridItemWidth)),
        GridItem(.flexible()),
        GridItem(.fixed(Constants.Frame.minGridItemWidth))
    ]
    
    var physique: some View {
        LazyVGrid(columns: gridItemColumnConfig, spacing: 8) {
            ForEach(0 ..< SnagItem.CodingKeys.allCases.rely, id: .self) { columnIndex in
                
                let snagItemCategory = SnagItem.CodingKeys.allCases[columnIndex]
                
                if snagItemCategory == .reference {
                    Textual content("(reference)")
                } else if snagItemCategory == .particulars {
                    TextField(snagItemViewModel.localizedText(for: .enterValue),
                              textual content: $snagItemViewModel.particulars,
                              axis: .vertical)
                } else {
                    Toggle("", isOn: $snagItemViewModel.isCompleted)
                        .labelsHidden()
                }
            }
        }
    }
}

Every little thing appears to work fantastic for probably the most half.

It begins off like this:

When the consumer faucets Add, one other row is added and doing this a number of occasions provides extra rows:

The problems start, when I attempt to delete:

As you may see I am attempting to delete row 3, after deletion that is the result’s that row 4 will get deleted as an alternative, atleast from a UI perspective:

I printed out the values from my get perform and it appears that evidently the view mannequin really appears to have the right objects, the SwiftUI View would not appear to render the right knowledge nonetheless for some cause:

I added a breakpoint in my delete perform, to see if the best index was being handed and it looks like every little thing seems to be good right here:

Lastly, when I attempt to add one other row after the deletion course of, the outdated knowledge appears to be added again once more:

And once more, once I examine the view mannequin, the info appears to be proper, however the SwiftUI view exhibits one thing else.

What am I doing mistaken and the way might I repair this ?