SwiftUI重新加载视图

时间:2020-01-23 06:01:35

标签: swiftui

我有一个结构,可以从CoreData中随机排序并列出记录。 我想用一个按钮重新加载/刷新列表视图。 我试图从Button中使用一个函数。 有办法吗?

    var body: some View {


            VStack {

                       List {

                           ForEach(dictionary.shuffled().prefix(upTo: 10),id: \.self) { word in


                            HStack {
                               Text("\(word.englishWord)")
                                    .foregroundColor(Color.blue)

                                Text("| \(word.urhoboWord) |")
                                    .foregroundColor(Color.green)

                                Image(word.imageName)
                                    .resizable()
                                    .frame(width:40, height: 40)


                            }//HStack

                           }//End of ForEach

                        }//End of List

                //Button to reload and shuffle list
                Button(action: {}) {

                    Text("Shuffle")
                        .padding()
                        .background(Color.black)
                        .foregroundColor(Color.white)
                        .cornerRadius(6)
                }


                        .navigationBarTitle(Text("Begin Learning"),displayMode: .inline)


2 个答案:

答案 0 :(得分:5)

您应该将此dictionary.shuffled().prefix(upTo: 10)移到ViewModel上,您的视图只是根据数据重新加载。 看一下这段代码以供参考:

struct SampleShuffleView : View {
    @ObservedObject var viewModel : ShuffleViewModel = ShuffleViewModel()

    var body : some View {
        VStack {
            List(self.viewModel.listData, id: \.self) { str in
                Text(str)
            }

            Button(action: self.shuffle) {
                Text("Shuffle me").padding()
            }.background(Color.white).padding()

        }
    }

    func shuffle() {
        self.viewModel.shuffle()
    }
}

class ShuffleViewModel : ObservableObject {
    @Published var listData = ["one", "two", "three", "four"]

    func shuffle() {
        listData.shuffle()
        //or listData = dictionary.shuffled().prefix(upTo: 10)
    }
}

注意:当@ObservedObject更改时,所有视图的组件都会重新加载,因此请考虑分离较小的view-viewmodel,或使用@State变量。

希望这会有所帮助。

答案 1 :(得分:1)

考虑一下。要在点击时显示数组和随机播放,请完全执行您想看到的内容。首先以类似“列表”的方式向我们展示该数组,然后根据用户操作对其进行洗牌。

struct ContentView: View {
    @State var arr = ["ALFA", "BETA", "GAMA", "DELTA"]
    var body: some View {
        VStack {
        VStack {
            Divider()
            ForEach(arr, id: \.self) { element in
                VStack {
                    Text(element)
                    Divider()
                }
            }
        }
            Spacer()
            Button(action: {
                self.arr.shuffle()
            }) {
                Text("Shuffle")
            }
            Spacer()
        }
    }
}

arr.shuffle()更改了View的@State,并强制SwiftUI自动“重新加载”。