带有 "PageTabViewStyle" 的 TabView 在 @State var 更改时不会更新其内容

Question

我在 SwiftUI 中遇到了一个奇怪的问题。我创建了一个只包含一个按钮的简单视图和一个使用 PageViewStyle 的 TabView。似乎 TabView 没有更新它的内容正确地取决于变量的状态。内容似乎以某种方式更新了，但视图不会像我期望的那样更新

这是我的视图代码：

struct ContentView: View {
    @State var numberOfPages: Int = 0
    @State var selectedIndex = 0
    
    var body: some View {
        VStack {
            Text("Tap Me").onTapGesture(count: 1, perform: {
                self.numberOfPages = [2,5,10,15].randomElement()!
                self.selectedIndex = 0
            })
            
            TabView(selection: $selectedIndex){
                ForEach(0..<numberOfPages, id: \.self) { index in
                    Text("\(index)").background(Color.red)
                }
            }
            .frame(height: 300)
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
        }.background(Color.blue)
    }
}

这是多次点击标签后的结果。初始状态不是 0 页。点击后，我希望 TabView 发生变化，因此所有页面都可以滚动和可见，但由于某些原因，只有页面指示器会更新它的状态。

Answer 1

TabView 期望有页面容器，但你只包含一个 HStack （有自己的动态内容），而且链接页面数量你必须重置选项卡视图，所以这里是修复。

测试 Xcode 12 / iOS 14

struct ContentView: View {
    @State var numberOfPages: Int = 0

    var body: some View {
        VStack {
            Text("Tap Me").onTapGesture(count: 1, perform: {
                self.numberOfPages = [2,5,10,15].randomElement()!
            })
            if self.numberOfPages != 0 {
                TabView {
                    ForEach(0..<numberOfPages, id: \.self) { index in
                        Text("\(index)").frame(width: 300).background(Color.red)
                    }
                }
                .tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
                .frame(height: 300)
                .id(numberOfPages)          // << here !!
            }
        }
    }
}

backup

带有 "PageTabViewStyle" 的 TabView 在 @State var 更改时不会更新其内容

TabView with "PageTabViewStyle" does not update it's content when @State var changes

tabview

swiftui