Swiftui 为 Json 数据项创建加载更多按钮答案

【问题标题】：Swiftui Creating a load more button for Json data itemsSwiftui 为 Json 数据项创建加载更多按钮
【发布时间】：2021-06-30 14:50:06
【问题描述】：

我的声望还没有达到 50，所以我无法评论这个问题 SwiftUI Issue displaying specific number of Json Data Items 来询问它是如何完成的。这个想法是在加载视图时显示 json 数组中的前 10 个项目，然后加载更多按钮以显示更多项目。这就是我的代码的样子。

Group {

    HStack {
        Text("Recommended Events")
           .font(.title3)
           .foregroundColor(.white)
           .fontWeight(.bold)
                                    
          Spacer()
                                    
           Button(action: {
            
           }) {
             Text("Show all")
               .font(.title3)
               .foregroundColor(Color.white)
               .fontWeight(.bold)
               }
           }
            .padding(15)

    ForEach(recommendeds) { recommended in
                                    NavigationLink(destination: RecommendedEventsDetailView(recommended: recommended)) {
                                    RecommendedEventsView(recommended: recommended)
                                    }
                                }

}

编辑

https://stackoverflow.com/users/14733292/raja-kishan 响应后，我尝试了它并收到此错误无法生成表达式诊断；请提交错误报告这是我现在的代码阶段。

struct RecommendedModel: Identifiable {
    var id = UUID()
    var number: Int
    
    init(_ number: Int) {
        self.number = number
    }
}


struct PlacesView: View { 
private var arrData: [RecommendedModel] = (0...10).map({RecommendedModel($0)})
        
        @State private var isMore: Bool = false
    
    
    //E-MARK: - Body
    var body: some View { 
Group {

    HStack {
        Text("Recommended Events")
           .font(.title3)
           .foregroundColor(.white)
           .fontWeight(.bold)
                                    
          Spacer()
                                    
           Button(action: {
            withAnimation {
                                isMore.toggle()
                            }
           }) {
             Text("Show all")
               .font(.title3)
               .foregroundColor(Color.white)
               .fontWeight(.bold)
               }
           }
            .padding(15)

    ForEach( (isMore ? arrData : recommendeds(arrData.prefix(5)))) { recommended in
                                    NavigationLink(destination: RecommendedEventsDetailView(recommended: \(recommended.number)) {
                                    RecommendedEventsView(recommended: \(recommended.number))
                                    }
                                }

}

}
}

下面是我之前的数据模型，它加载了保存为RecommendedModel.swift的json数据

struct Recommended: Codable, Identifiable {
    let id: String
    let image: String
    let date: String
    let month: String
    let like: String
    let rating: String
    let heading: String
    let place: String
    let article: String
    let more: String
    
}

【问题讨论】：

目前有什么问题？
我已经知道它需要使用 ObservedObject 来控制来自 developer.apple.com/tutorials/swiftui 的数据，但在示例中它是用于切换，我无法使用 swiftui 按钮

标签： json foreach swiftui

【解决方案1】：

你可以这样做。

您可以通过.prefix() 从数组中加载前 10 个或 50 个。

演示代码

struct DataModel: Identifiable {
    var id = UUID()
    var number: Int
    
    init(_ number: Int) {
        self.number = number
    }
}

struct LoadMoreDemo: View {
    
    private var arrData: [DataModel] = (0...100).map({DataModel($0)})
    
    @State private var isMore: Bool = false
    
    var body: some View {
        VStack {
            ScrollView {
                ForEach( (isMore ? arrData : Array(arrData.prefix(15)))) { item in
                    Text("\(item.number)")
                }
            }
            
            Button("Load More") {
                withAnimation {
                    isMore.toggle()
                }
            }
        }
    }
}

【讨论】：