单击后退按钮并更新状态数据后，swiftui 子视图重新出现 [英] swiftui subview reappear after click the back button and update state data

问题描述

非常奇怪的行为.

点击子页面(Subview)的后退按钮返回主页面(ContentView).但是，子页面(Subview)会自动再次打开.为什么?

Click the back button on the subpage (Subview) to return to the main page (ContentView). However, the subpage (Subview) automatically opens again. Why?

import SwiftUI

struct ContentView: View {
    @State var things: [String] = []
    @State var count: Int = 0
    
    var body: some View {
        NavigationView{
            List {
                ForEach(things.indices, id: .self) { index in
                    Text(things[index])
                }
            }
            .onAppear {
                update()
            }
           
            .navigationTitle("a")
            .toolbar{
                NavigationLink(destination: Subview(count: $count), label: {
                    Text("sub")
                })
            }
        }
        
    }
    
    func update() {
        things = []
        for i in 0...count {
            things.append(String(i))
        }
    }
}

struct Subview: View {
    var count : Binding<Int>

    var body: some View {
        Text("sub")
            .onAppear {
                count.wrappedValue += 1
            }
    }
}

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

推荐答案

NavigationLink 应始终位于 NavigationView 内.如果你把它放在工具栏或其他地方，你可能会遇到奇怪的问题.

NavigationLink should always be inside a NavigationView. If you put it in the toolbar or some other place, you might run into weird issues.

相反，请使用 init(destination:isActive:label:) 初始值设定项.然后，当您想显示下一页时，将 presentingNextPage 属性设置为 true.

Instead, use the init(destination:isActive:label:) initializer. Then set the presentingNextPage property to true when you want to present the next page.

struct ContentView: View {
    @State var things: [String] = []
    @State var count: Int = 0
    @State var presentingNextPage = false
    
    var body: some View {
        NavigationView {
            
            List {
                ForEach(things.indices, id: .self) { index in
                    Text(things[index])
                }
                
                /// placeholder navigation link
                NavigationLink(destination: Subview(count: $count), isActive: $presentingNextPage) {
                    EmptyView()
                }
            }
            .onAppear {
                self.update()
            }
            .navigationTitle("a")
            .toolbar{
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("sub") {
                        presentingNextPage = true /// set to true
                    }
                }
                
            }
        }
    }
    
    func update() {
        things = []
        for i in 0...count {
            things.append(String(i))
        }
    }
}

结果:

这篇关于单击后退按钮并更新状态数据后，swiftui 子视图重新出现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！