时间戳

首页 > 解决方案 > SwiftUI：添加元素时选择器内容未刷新

swiftui - SwiftUI：添加元素时选择器内容未刷新

问题描述

我在 VStack 中有一个 Picker 元素，但是当它的内容通过添加新元素而改变时，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)")
        }
    }
}

提前感谢您的帮助！

标签： swiftuipicker

解决方案

这是反应式的技巧，当您需要刷新某些内容时，请始终使用相同内容的两个副本。

 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)")
    }
}

}

推荐阅读