更改内容顺序时，SwiftUI MacOS 列表布局出现故障

Posted 2023-02-24

【中文标题】更改内容顺序时，SwiftUI MacOS 列表布局出现故障

【英文标题】：SwiftUI MacOS List layout glitches when changing content order

【发布时间】：2021-01-18 18:30:45

【问题描述】：

为了便于复制，我在下面包含了示例代码来完全重现我的问题。

问题

在更改其内容的顺序时，似乎有一个错误会扰乱列表布局，它似乎只影响我的测试中的 MacOS。

ScrollView 不会出现这种情况，但在这种情况下，我必须使用 List（因为我需要导航链接的“双击打开窗口”功能，该功能似乎仅在 List 中有效）

任何变通方法或解决方案将不胜感激。谢谢！

import SwiftUI

struct Book : Hashable 
    var title: String
    var description: String


struct ContentView: View 
    
    @State var books : [Book] = [
        Book(title: "Book 1", description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ligula urna, vestibulum in consequat facilisis, efficitur quis quam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Praesent in ullamcorper lectus, eget accumsan nisi. Vivamus lorem ante, auctor in ultricies a, gravida id ligula. Etiam vitae ante augue. "),
        Book(title: "Book 2", description: "Ut consectetur ligula massa, in convallis diam consequat eu. Praesent nec justo blandit, posuere nisl a, consequat orci. Fusce maximus laoreet magna, ut commodo neque pellentesque eu. Aliquam condimentum urna massa, eget efficitur orci ultrices ut. Curabitur euismod feugiat mollis. Cras urna elit, varius vel lorem at, convallis tempus sapien. Integer vel purus gravida, tempus quam ac, molestie justo."),
        Book(title: "Book 3", description: "Nulla congue mi eget suscipit elementum. Donec efficitur ante id lorem fringilla tempus. Vivamus et interdum nisi.")
    ]
    
    @State var sortedBooks = [Book]()
    
    func sortBooksByTitle()
        sortedBooks = books.sorted 
            $0.title < $1.title
        
    
    
    func sortBooksBytDesc()
        sortedBooks = books.sorted 
            $0.description < $1.description
        
    
    
    var body: some View 
        VStack
            HStack
                Button(action: 
                    sortBooksBytDesc()
                , label: 
                    Text("Sort By description")
                )
                Button(action: 
                    sortBooksByTitle()
                , label: 
                    Text("Sort By title")
                )
            
            
            List
                
                ForEach(sortedBooks, id: \.self)  book in
                    VStack
                        Text(book.title)
                            .font(.title)
                        Text(book.description)
                            .foregroundColor(.gray)
                    
                
            

        
        .onAppear
            sortBooksByTitle()
        
    


struct ContentView_Previews: PreviewProvider 
    static var previews: some View 
        ContentView()
    

在 Xcode 12.3 上测试并在 MacOS 上运行

【参考方案1】：

解决方案：

添加：.id(UUID()) 到 List 的末尾