当我在选择器中选择一个选项卡时显示一个新视图答案

【问题标题】：Display a new view when i select a tab in the picker当我在选择器中选择一个选项卡时显示一个新视图
【发布时间】：2020-12-15 11:21:46
【问题描述】：

我有一个包含 3 个值的选择器。如何根据选择器选项卡的选择显示一些信息？

@State var tabSelectedValue = 0

var body: some View{
    
    VStack {
        Picker(selection: $tabSelectedValue, label: Text("")) {
            Text("A").tag(0)
            Text("B").tag(1)
            Text("C").tag(2)
            
        }.pickerStyle(SegmentedPickerStyle())
    }
    
}

【问题讨论】：

标签： swiftui picker

【解决方案1】：

@State var tabSelectedValue = 0
    var yourData = ["one", "Two", "Three"]

    var body: some View{
        
        VStack {
            Text("\(yourData[tabSelectedValue])")
            Picker(selection: $tabSelectedValue, label: Text("")) {
                Text("A").tag(0)
                Text("B").tag(1)
                Text("C").tag(2)
                
            }.pickerStyle(SegmentedPickerStyle())
        }
        
    }

或者你可以和 TabView 一起使用，

struct ContentView: View {
    @State var tabSelectedValue = 0
    
    var body: some View{
        
        VStack {
            Picker(selection: $tabSelectedValue, label: Text("")) {
                Text("A").tag(0)
                Text("B").tag(1)
                Text("C").tag(2)
                
            }.pickerStyle(SegmentedPickerStyle())
            
            TabView(selection: $tabSelectedValue,
                    content:  {
                        Text("A Tab Content").tag(0)
                        Text("B Tab Content").tag(1)
                        Text("C Tab Content").tag(2)
                    })
                .tabViewStyle(PageTabViewStyle())
        }
    }
    
}

【讨论】：

【解决方案2】：

struct PickerDataView: View {
    var data: String
    
    var body: some View {
        Text("Picker Date \(data)")
    }
}

struct ContentView: View {
    @State private var tabSelectedValue = 0
    
    private var pickerData: [String] = ["A", "B", "C"]
    
    var body: some View {
        VStack {
            
            PickerDataView(data: "\(pickerData[tabSelectedValue])")

            Picker(selection: $tabSelectedValue, label: Text("")) {
                ForEach(0 ..< pickerData.count) {
                    Text(pickerData[$0]).tag($0)
                }
                
            }.pickerStyle(SegmentedPickerStyle())
        }
    }
}

【讨论】：