SwiftUI - 致命错误：从数组中删除元素时索引超出范围

Question

I have an array on appstorage. I'm displaying its elements with foreach method. It has swipe to delete on each element of the array. But when i delete one, app is crashing. Here is my first view;

struct View1: View {

    @Binding var storedElements: [myElements]
    
    var body: some View{
        GeometryReader {
            geometry in
        
        VStack{
            ForEach(storedElements.indices, id: \.self){i in
                View2(storedElements: $storedElements[i], pic: $storedWElements[i].pic, allElements: $storedElements, index: i)
                }
        }.frame(width: geometry.size.width, height: geometry.size.height / 2, alignment: .top).padding(.top, 25)
        }
    }
    
}

And View 2;

struct View2: View {
    
    @Binding var storedElements: myElements
    @Binding var pic: String
    @Binding var allElements: [myElements]
    var index: Int
    
    @State var offset: CGFloat = 0.0
    @State var isSwiped: Bool = false
    
    @AppStorage("pics", store: UserDefaults(suiteName: "group.com.some.id"))
    var arrayData: Data = Data()
    
    var body : some View {
            ZStack{
                
                Color.red
                
                HStack{
                    Spacer()
                    
                    Button(action: {
                        withAnimation(.easeIn){
                            delete()}}) {
                        Image(systemName: "trash").font(.title).foregroundColor(.white).frame(width: 90, height: 50)
                    }
                }
                View3(storedElements: $storedElements).background(Color.red).contentShape(Rectangle()).offset(x: self.offset).gesture(DragGesture().onChanged(onChanged(value:)).onEnded(onEnd(value:)))
            }.frame(width: 300, height: 175).cornerRadius(30)
        }
    }
    func onChanged(value: DragGesture.Value) {
        
        if value.translation.width < 0 {
            
            if self.isSwiped {
                self.offset = value.translation.width - 90
            }else {
                self.offset = value.translation.width
            }
        }
    }
    func onEnd(value: DragGesture.Value) {
        
        withAnimation(.easeOut) {
            if value.translation.width < 0 {
                if -value.translation.width > UIScreen.main.bounds.width / 2 {
                    self.offset = -100
                    delete()
                }else if -self.offset > 50 {
                    self.isSwiped = true
                    self.offset = -90
                }else {
                    self.isSwiped = false
                    self.offset = 0
                }
            }else {
                self.isSwiped = false
                self.offset = 0
            }
        }
    }
    
    func delete() {
        //self.allElements.remove(at: self.index)
        if let index = self.allElements.firstIndex(of: storedElements)  {
            self.allElements.remove(at: index)
        }
    }
}

OnChange and onEnd functions are for swiping. I think its the foreach method that is causing crash. Also tried the commented line on delete function but no help. And I know its a long code for a question. I'm trying for days and tried every answer here but none of them solved my problem here.

Answer 1

In your myElements class/struct, ensure it has a unique property. If not add one and upon init set a unique ID

public class myElements {
  var uuid: String
  
  init() {
      self.uuid = NSUUID().uuidString
  }
}

Then when deleting the element, instead of

if let index = self.allElements.firstIndex(of: storedElements)  {
    self.allElements.remove(at: index)
}

Use

self.allElements.removeAll(where: { a in a.uuid == storedElements.uuid })

This is array bound safe as it does not use an index