SwiftUI:添加元素时选择器内容未刷新

Question

我在 VStack 中有一个 Picker 元素，但是当通过添加新元素更改其内容时，Picker 不会刷新。

在隐藏和显示 Picker 之后，新元素可见。

有没有人知道如何在不需要隐藏/显示的情况下刷新选择器的内容？

您可以通过创建一个新的 SwiftUI 项目并复制以下代码而不是“ContentView”结构来重现这一点。

class ContentModel {
    @Published var pickerData: [String] = ["1"]

    func addPickerData() {
        pickerData.append("\(pickerData.count + 1)")
    }
}

struct ContentView: View {
    let contentModel = ContentModel()

    @State private var showPicker = false
    @State private var selectedPickerValue = ""

    var body: some View {
        VStack(spacing: 8) {
            Text("Adding a new Element to the Picker does not refresh its content :-(")
            Button(action: {
                self.contentModel.addPickerData()
            }) {
                Text("Add Picker Data")
            }
            Button(action: {
                self.showPicker.toggle()
            }) {
                Text("Show / Hide 2nd Picker")
            }
            Picker("Select",selection: $selectedPickerValue) {
                ForEach(contentModel.pickerData, id: \.self) { data in
                    Text(data)
                }
            }
            if (showPicker) {
                Picker("Select",selection: $selectedPickerValue) {
                    ForEach(contentModel.pickerData, id: \.self) { data in
                        Text(data)
                    }
                }
            }
            Text("Selected Value: \(selectedPickerValue)")
        }
    }
}

在此先感谢您的帮助!

Answer 1

这是响应式的技巧，当你需要刷新某些东西时，总是使用同一事物的两个副本。

 class ContentModel{
 @Published var pickerData: [String] = ["1"]

   func addPickerData() {
       pickerData.append("\(pickerData.count + 1)")
   }

}

struct ContentSSView: View {
let contentModel = ContentModel()

@State private var showPicker = false
@State private var selectedPickerValue = ""

var body: some View {
    VStack(spacing: 8) {
        Text("Adding a new Element to the Picker does not refresh its content :-(")
        Button(action: {
            self.contentModel.addPickerData()
             self.showPicker.toggle()
        }) {
            Text("Add Picker Data")
        }
        Button(action: {
            self.showPicker.toggle()
        }) {
            Text("Show / Hide 2nd Picker")
        }

        if (showPicker) {
            Picker("Select",selection: $selectedPickerValue) {
                ForEach(contentModel.pickerData, id: \.self) { data in
                    Text(data)
                }
            }
        }else{
            Picker("Select",selection: $selectedPickerValue) {
                ForEach(contentModel.pickerData, id: \.self) { data in
                    Text(data)
                }
            }
        }
        Text("Selected Value: \(selectedPickerValue)")
    }
}