SwiftUI中使用.onMove拖拽列表元素出现跳变问题求助

问题根源 #

你遇到的拖拽时元素先消失、一秒后跳转到目标位置的现象，本质是错误地使用数组索引作为ForEach的标识id。SwiftUI通过id跟踪视图与数据源的对应关系，拖拽排序会改变元素的索引值，导致SwiftUI误判原位置的视图被删除、新位置的是全新视图，因此没有平滑过渡动画，只会生硬刷新视图。

修复方案 #

你的Data结构体已经实现了Identifiable协议，直接用数据对象作为ForEach的数据源即可，无需通过索引遍历。同时调整数据修改方式，让SwiftUI能正确感知视图更新：

import SwiftUI

struct Data: Identifiable {
    var id: UUID
    var number: Int = 0
    var text: String
}

struct ContentView: View {
    
    @State private var myData: [Data] = [
        Data(id: UUID(), text: "1111111"),
        Data(id: UUID(), text: "2222222"),
        Data(id: UUID(), text: "3333333"),
        Data(id: UUID(), text: "4444444"),
        Data(id: UUID(), text: "5555555"),
        Data(id: UUID(), text: "6666666")
    ]
    
    var body: some View {
        VStack {
            List {
                ForEach($myData) { $item in
                    Button("\(item.text) (\(item.number))") {
                        item.number += 1
                    }
                }.onMove(perform: move)
            }
        }
    }
    
    func move(from source: IndexSet, to destination: Int) {
        myData.move(fromOffsets: source, toOffset: destination)
    }
}

关键修改点 #

• ForEach数据源替换：把ForEach(0..<myData.count, id: \.self)改为ForEach($myData)，利用Identifiable的id让SwiftUI精准跟踪每个数据对应的视图，拖拽时能正确识别元素移动，触发平滑动画。
• 数据绑定优化：使用$item绑定数据，修改number时SwiftUI能即时感知并更新视图，避免索引访问可能带来的更新不及时问题。
• 简化State初始化：直接在@State声明时初始化数据，无需在init里手动赋值，代码更简洁。

修改后拖拽排序时，元素会平滑过渡到目标位置，不会再出现消失跳变的现象。

内容的提问来源于stack exchange，提问作者Jens