ScrollViewReader 无法通过代码触发滚动问题求助

我来帮你分析下问题所在，以及对应的解决办法：

核心原因：状态更新与滚动时机不匹配 #

你的简化版代码能正常工作，是因为列表的元素是预先存在的（0..<100），点击按钮时直接滚动到已渲染的元素上。但你的实际代码中，vm.submit()是先添加新元素到guesses数组，然后立刻调用scrollTo——这时候SwiftUI还没来得及刷新视图、渲染新添加的列表项，scrollTo找不到对应的id，自然不会生效。

另外还要先确认你的ViewModel中guesses是否用了@Published修饰，如果没有，SwiftUI根本感知不到数组的变化，列表不会刷新，滚动更是无从谈起：

class GameViewModel: ObservableObject {
    // 必须用@Published让SwiftUI监听变化
    @Published var guesses: [[Color]] = [] 

    func submit() {
        // 你的添加新猜测的逻辑
        guesses.append([Color.red, Color.blue, Color.green, Color.yellow])
    }
}

两种可靠的解决办法 #

方法1：延迟滚动，等待视图刷新

在调用vm.submit()后，通过DispatchQueue.main.async延迟执行滚动操作，给SwiftUI足够的时间刷新列表、渲染新元素：

FABButton(text: "SUBMIT")
    .onTapGesture {
        vm.submit()
        // 等待视图更新完成后再滚动
        DispatchQueue.main.async {
            reader.scrollTo(vm.guesses.count - 1)
        }
    }

方法2：通过监听数组变化触发滚动（更推荐）

使用.onChange修饰符监听guesses数组的长度变化，每当数组新增元素时自动滚动到底部，这种方式更贴合SwiftUI的响应式逻辑：

List {
    ForEach(0..<vm.guesses.count, id: \.self) { i in
        HStack{
            Spacer()
            ColorsChosenView(locationCorrect: 1, locationIncorrect: 3, 
                            color1: vm.guesses[i][0], color2: vm.guesses[i][1], 
                            color3: vm.guesses[i][2], color4: vm.guesses[i][3])
            Spacer()
        }.id(i)
    }
}
.listStyle(InsetListStyle())
// 监听guesses数量变化，自动滚动到底部
.onChange(of: vm.guesses.count) { newCount in
    if newCount > 0 {
        reader.scrollTo(newCount - 1)
    }
}

额外优化建议 #

如果你的guesses中的元素可以遵循Identifiable协议，建议把id绑定到元素本身而不是索引，这样滚动的目标更稳定（比如后续如果有删除操作，索引会变化，但元素的id不会）：

// 先让单个猜测元素遵循Identifiable
struct Guess: Identifiable {
    let id = UUID()
    let colors: [Color]
}

// ViewModel中的guesses改为[Guess]
@Published var guesses: [Guess] = []

// 列表中的ForEach改为直接遍历元素
ForEach(vm.guesses) { guess in
    HStack{
        Spacer()
        ColorsChosenView(locationCorrect: 1, locationIncorrect: 3, 
                        color1: guess.colors[0], color2: guess.colors[1], 
                        color3: guess.colors[2], color4: guess.colors[3])
        Spacer()
    }.id(guess.id)
}

// 滚动时直接用最后一个元素的id
reader.scrollTo(vm.guesses.last?.id)

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