SwiftUI 中出现键盘时 OnAppear 意外调用

Question

我在 SwiftUI 2.0 和 iOS14 中遇到了非常奇怪的行为。

当键盘出现在屏幕上时，自动调用其他标签视图的OnAppear方法。

但是，这在 Xcode 11.7 中运行良好

这是正在发生的问题。

这是产生上述错误的代码。

struct ContentView: View {
    var body: some View {
        TabView {
            DemoView(screenName: "Home")
                .tabItem {
                    Image.init(systemName: "star.fill")
                    Text("Home")
                }
            DemoView(screenName: "Result")
                .tabItem {
                    Image.init(systemName: "star.fill")
                    Text("Result")
                }
            DemoView(screenName: "More")
                .tabItem {
                    Image.init(systemName: "star.fill")
                    Text("More")
                }
        }
    }
}

struct DemoView:View {
    
    @State var text:String = ""
    var screenName:String
    var body: some View {
        VStack{
            Text(screenName)
                .font(.title)
            
            TextField("Buggy Keyboard Issue", text: $text)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                
            Text("Issue : When keyboard appears, onAppear of other 2 tabs call automatically.")
                .font(.footnote)
        }
        .padding()
        .onAppear(perform: {
            debugPrint("OnAppear of : \(screenName)")
        })
    }
}

这似乎是 SwiftUI 2.0 的错误，但不确定。 任何帮助将不胜感激。

谢谢

Answer 1

我自己也有同样的问题，我认为这是一个错误或类似的问题，但是我想出了一个解决方案，也许是一种解决方法，直到苹果修复它。

我所做的事情基本上是我使用了LazyVStack，这似乎工作得很好。

LazyVStack {
    VStack{
        Text(screenName)
            .font(.title)
        
        TextField("Buggy Keyboard Issue", text: $text)
            .textFieldStyle(RoundedBorderTextFieldStyle())
            
        Text("Issue : When keyboard appears, onAppear of other 2 tabs call automatically.")
            .font(.footnote)
    }
    .padding()
    .onAppear(perform: {
        debugPrint("OnAppear of : \(screenName)")
})
}

现在其他选项卡视图的OnAppear方法在键盘出现时不会自动调用。

Answer 2

刚刚实施了以下解决方法：

struct ContentView: View {
    var body: some View {
        TabView(selection: $selectedTab) {
            TabContentView(tag: 0, selectedTag: selectedTab) {
                Text("Some tab content")
            }
            .tabItem {
                Text("First tab")
            }
            TabContentView(tag: 0, selectedTag: selectedTab) {
                Text("Another tab content")
            }
            .tabItem {
                Text("Second tab")
            }
        }
    }
    
    @State private var selectedTab: Int = 0
}

private struct TabContentView<Content: View, Tag: Hashable>: View {
    init(tag: Tag, selectedTag: Tag, @ViewBuilder content: @escaping () -> Content) {
        self.tag = tag
        self.selectedTag = selectedTag
        self.content = content
    }

    var body: some View {
        Group {
            if tag == selectedTag {
                content()
                    .frame(maxWidth: .infinity, maxHeight: .infinity)
            } else {
                Color.clear
            }
        }
        .tag(tag)
    }

    private let tag: Tag
    private let selectedTag: Tag
    private let content: () -> Content
}

不确定它是否足够稳定，但键盘外观不再在标签内容上触发onAppear。

Answer 3

为避免重新加载视图，请尝试在 TabView 上

.ignoresSafeArea(.keyboard, edges: .bottom)

它仅适用于 iOS 14