SwiftUI List绑定枚举数据源无法实现动画的解决咨询

核心原因 #

List的动画依赖于对数据源**元素标识（Identifiable的id）和元素相等性（Equatable）**的准确判断。你的代码存在两个关键问题：

• UserCellViewModel是类类型，默认以引用地址判断相等性，每次调用add()/remove()时都会创建全新实例——即使id相同，也会被判定为不同对象
• 枚举CellType的Equatable默认会比较关联值，由于UserCellViewModel的引用不同，导致整个CellType被判定为不相等，List会认为是完全替换数组而非增删元素，因此不会触发动画

修改方案 #

方案1：让UserCellViewModel实现Equatable

让类基于id判断相等性，这样枚举的关联值比较会正确识别相同数据的实例：

class UserCellViewModel: Identifiable, Equatable {
    let id: String
    let user: User
    
    init(user: User) {
        self.id = user.name // 假设User的name作为唯一标识，可根据实际业务调整
        self.user = user
    }
    
    static func == (lhs: UserCellViewModel, rhs: UserCellViewModel) -> Bool {
        lhs.id == rhs.id
    }
}

方案2：复用已有的UserCellViewModel实例

更新数据源时尽量保留已有实例，只增删必要元素，避免完全替换数组。修改TestViewModel的add()和remove()方法：

class TestViewModel: ObservableObject {
    // 保留原有其他代码
    
    func add() {
        let targetNames = ["Paul", "Taylor", "Adele", "Test"]
        // 先提取已存在的ViewModel
        let existingVMs = users.compactMap { element -> UserCellViewModel? in
            guard case .cell(let vm) = element else { return nil }
            return vm
        }
        
        let newCells = targetNames.map { name in
            // 优先复用已有实例，不存在则新建
            if let existingVM = existingVMs.first(where: { $0.id == name }) {
                return CellType.cell(viewModel: existingVM)
            } else {
                return CellType.cell(viewModel: UserCellViewModel(user: User(name: name)))
            }
        }
        
        users = newCells
    }
    
    func remove() {
        let keepNames = ["Paul", "Test"]
        users = users.filter { element in
            guard case .cell(let vm) = element else { return false }
            return keepNames.contains(vm.id)
        }
    }
}

方案3：用withAnimation包裹数据源更新

将动画触发逻辑直接放在数据源修改的地方，比父视图的animation修饰符更精准适配List：

func add() {
    withAnimation {
        users = ["Paul", "Taylor", "Adele", "Test"]
            .map { UserCellViewModel(user: User(name: $0)) }
            .map { CellType.cell(viewModel: $0) }
    }
}

func remove() {
    withAnimation {
        users = ["Paul", "Test"]
            .map { UserCellViewModel(user: User(name: $0)) }
            .map { CellType.cell(viewModel: $0) }
    }
}

验证效果 #

完成以上任意方案修改后，List在数据源更新时会正确识别元素的增删操作，触发和LazyVStack一致的插入/删除动画。

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