SwiftUI中onAppear内滚动导致ObservableObject状态更新丢失问题

问题现象 #

在iOS 17.5/18.0的模拟器及真机上，当通过ScrollViewProxy在视图onAppear方法中调用scrollTo时，会出现ObservableObject的@Published值视图显示与实际值不同步的问题：

• 点击"Toggle States"按钮后，ViewModel中state1最终被设为false，但视图始终显示State1: true
• 移除onAppear中的scrollProxy.scrollTo(state2ID)调用，视图状态会正常同步

问题原因 #

这是SwiftUI动画与状态更新调度的已知bug：当scrollTo在onAppear中配合withAnimation执行时，会干扰SwiftUI的视图更新队列，导致最后一次state1=false的状态更新被丢弃，视图停留在之前的true状态。本质是动画过程中视图的状态快照没有正确捕获最新的@Published值。

解决方案 #

以下几种方法可以绕过该bug：

方法1：给scrollTo添加微小延迟 #

让状态更新先完成，再触发滚动：

.onAppear {
    DispatchQueue.main.asyncAfter(deadline: .now() + 0.01) {
        withAnimation {
            scrollProxy.scrollTo(state2ID)
        }
    }
}

方法2：用Task延迟执行滚动 #

通过Task的延迟执行错开状态更新与滚动的时机：

.onAppear {
    Task { @MainActor in
        try? await Task.sleep(nanoseconds: 10_000_000) // 10ms延迟
        withAnimation {
            scrollProxy.scrollTo(state2ID)
        }
    }
}

方法3：在ViewModel状态更新后触发滚动 #

避免在onAppear中直接触发滚动，改为在ViewModel的state2更新完成后通知视图执行滚动：
修改ViewModel：

@MainActor
final class ContentViewModel: ObservableObject {
    @Published private(set) var state1 = false
    @Published private(set) var state2 = false
    private var stateToggle = false

    func toggleStates() {
        Task { @MainActor in
            state1 = true
            defer {
                print("Resetting state1")
                state1 = false
            }

            stateToggle.toggle()

            if stateToggle {
                withAnimation {
                    state2 = true
                }
            } else {
                state2 = false
            }
        }
    }
}

修改视图：

struct ContentView: View {
    @StateObject private var viewModel = ContentViewModel()
    @Namespace private var state2ID

    var body: some View {
        ScrollViewReader { scrollProxy in
            ScrollView(.vertical) {
                // 原有视图内容...
            }
            .onChange(of: viewModel.state2) { isEnabled in
                if isEnabled {
                    withAnimation {
                        scrollProxy.scrollTo(state2ID)
                    }
                }
            }
        }
    }
}

方法4：移除scrollTo的动画 #

如果业务允许无动画滚动，直接执行scrollTo可以避免动画干扰状态更新：

.onAppear {
    scrollProxy.scrollTo(state2ID)
}

总结 #

这确实是SwiftUI的不符合预期的bug，并非遗漏基础概念。上述方法均可解决该问题，可根据你的动画需求和代码结构选择合适的方案。

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