SwiftUI如何从一个详情页跳转到另一个详情页return到列表页?

How to jump from one detail page to another and return to the list page in SwiftUI?

当我使用“下一篇文章”按钮跳转到索引为3的文章详情页面时,我想直接返回文章列表页面而不是索引为文章详情页面2.I试过了搜索到return到指定页面并销毁页面的方法,但是我在swiftui中没有找到them.How实现这个效果?Thanks.I猜想其他的也会出现同样的场景移动开发,对吧? ArticleListView 是:

struct ArticleListView: View {
    
    @EnvironmentObject var modelData:ModelData
    
    var body: some View {
        NavigationView{
            List{
                ForEach(modelData.articleList){ article in
                    NavigationLink(destination:ArticleDetail(index:article.index)){
                        ArticleItem(index:article.index);
                    }
                }
            }
            .listStyle(PlainListStyle())
        }
    }
}

文章详情是这样的:

struct ArticleDetail: View {
    
    @EnvironmentObject var modelData:ModelData
    var index:Int
    
    var body: some View {
        
            VStack{
                Text(modelData.articleList[index].htmlText)
                
                NavigationLink(destination:ArticleDetail(index:self.index+1)){
                    Text("next article")
                }
            }
        
    }
}

Article/ArticleItemView/ModelData是这样的:

struct Article:Identifiable{
    var id = UUID()
    var index:Int
    var htmlText:String
}

struct ArticleItem: View {
    
    @EnvironmentObject var modelData:ModelData
    var index:Int
    var body: some View {
        Text(modelData.articleList[index].htmlText)
    }
}

final class ModelData:ObservableObject {
    @Published var articleList = [Article(index:0,htmlText: "first test text "),Article(index:1,htmlText: "second test text"),Article(index:2,htmlText: "third test text")]
}

此解决方案存在一些潜在的可扩展性问题,但它完成了基本工作:


struct Article {
    var id = UUID()
}

struct ContentView: View {
    
    var articles = [Article(), Article(), Article(), Article()]
    @State private var activeId : UUID?
    
    func activeBinding(id: UUID) -> Binding<Bool> {
        .init { () -> Bool in
            activeId == id
        } set: { (newValue) in
            activeId = newValue ? id : nil
        }
    }
    
    var body: some View {
        
        NavigationView {
            VStack(alignment: .leading, spacing: 20) {
                ForEach(articles, id: \.id) { article in
                    NavigationLink(destination: ArticleView(article: article,
                                                            articles: articles,
                                                            popToTop: { activeId = nil }),
                                   isActive: activeBinding(id: article.id)) {
                        Text("Link to article: \(article.id)")
                    }
                }
            }
        }
    }
}

struct ArticleView : View {
    var article : Article
    var articles : [Article]
    var popToTop: () -> Void
    
    var body : some View {
        VStack(alignment: .leading, spacing: 20) {
            Text("Current: \(article.id)")
            
            Button("Pop") {
                popToTop()
            }
            
            ForEach(articles, id: \.id) { listArticle in
                NavigationLink(destination: ArticleView(article: article, articles: articles, popToTop: popToTop)) {
                    Text("Link to article: \(listArticle.id)")
                }
            }
        }
    }
}

在主页上,顶级文章 ID 存储在 @State 变量中。这与顶级 link 上的 isActive 属性 的自定义绑定相关联。基本上,当文章处于活动状态时,link 出现,当 activeId 为 nil 时,link 变为非活动状态,并弹出到顶部。

因为这是顶层视图,所以如果顶层 NavigationLink 处于非活动状态,堆栈中较低的任何视图都将被弹出。

popToTop 是一个传递给后续文章视图并在按下“弹出”按钮时调用的函数。