滚动视图中的内容作为列表项在滚动（swiftui）时消失，为啥？

Posted 2023-02-24

【中文标题】滚动视图中的内容作为列表项在滚动（swiftui）时消失，为啥？

【英文标题】：Content in scrollview as a list item disappears when scrolling (swiftui), why?滚动视图中的内容作为列表项在滚动（swiftui）时消失，为什么？

【发布时间】：2020-01-19 14:20:43

【问题描述】：

@Asperi 的解决方案，ScrollView().id(UUID().uuidString)。

列表项中有一个scrollview，当我滚动列表时，scrollview中的内容消失了。

我认为问题在于滚动视图和列表可重用项目冲突。

如果我删除滚动视图（只是 hstack），什么都不会消失。所以我认为这是滚动视图的问题。有什么理想吗？

struct ContentView: View 
    var body: some View 
        List 
            ForEach(0...100, id: \.self)  _ in
                ItemView().padding()
            
        
    


struct ItemView: View 
    var body: some View 
        VStack(alignment: .leading) 
            Text("Tag list:")
            ScrollView(.horizontal, showsIndicators: false) 
                HStack 
                    ForEach(0...8, id: \.self)  _ in
                        TagView1()
                    
                
            .id(UUID().uuidString) /// <- fix
        
    


struct TagView1: View 
    var body: some View 
        Text("Tag\(String(UUID().uuidString.prefix(5)))")
            .foregroundColor(.secondary)
            .padding(.horizontal, 2)
            .background(RoundedRectangle(cornerRadius: 4).stroke(Color.secondary.opacity(0.5)))
            .padding(1)
    

【参考方案1】：

如果我正确理解了消失的内容（我假设您的意思是垂直滚动时的列表行），那么是的，这是由于 List 重用/缓存优化问题。

以下方法应该可以工作（使用 Xcode 11.2 / ios 13.2 测试）

struct ItemView: View 
    var body: some View 
        VStack 
            Text("Tag list:")
            ScrollView(.horizontal, showsIndicators: false) 
                HStack 
                    ForEach(0...8, id: \.self)  _ in
                        TagView().padding()
                    
                
            .id(UUID().uuidString) // << here is a fix !
        
    

【讨论】：

我修改了帖子。

容器必须是list，不能是VStack。

ScrollView().id(UUID().uuidString) 是关键分辨率，感谢@Asperi。