上拉加載:
無論是在List或者ScrollView,都是通過在尾行添加隱藏控件,在其onAppear()方法中實現(xiàn)加載數(shù)據(jù)。
這并不是最好的解決方案,但是確實可行。未來此方案在SwiftUI配套設施更加完善后應該被替換掉。
ScrollView/List:
iOS14的List建議使用ScrollVIew + LazyVStack的方式實現(xiàn)。目前SwiftUI的List比較古板,不太容易定制化。如果執(zhí)意使用List,此方案也可以實現(xiàn)。
struct DemoView: View {
// 數(shù)據(jù)源
@State private var dataSource: [String] = []
// 刷新狀態(tài)綁定
@State private var isRefreshing: Bool = false
// 頁碼
@State private var page: Int = 0
private var refreshListener: some View {
// 一個任意視圖,我們將把它添置在滾動列表的尾部
LoadingView(isLoading: $isRefreshing)
.frame(width: 150, height: 35) // height: 如果有加載動畫就設置,沒有設置為0就可以
.onAppear(perform: {
page += 1
loadData()
})
}
private func loadData() {
isRefreshing = true
DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
// 偽代碼,模擬數(shù)據(jù)網絡加載
dataSource += newDataSource
isRefreshing = false
}
}
var body: some View {
// 1.如果使用ScrollView
ScrollView(.vertical) {
// 使用懶加載,確?;瑒拥皆貯ppear。
LazyVStack {
ForEach(0..<dataSource.count, id: \.self) { index in
Text("\(dataSource[index])")
}
// 加載更多
refreshListener
}
}
.onAppear {
// 頁面出現(xiàn)獲取數(shù)據(jù)
loadData()
}
// 2.如果使用List
/*
List {
LazyVStack {
ForEach(0..<dataSource.count, id: \.self) { index in
Text("\(dataSource[index])")
}
// 加載更多
refreshListener
}
}
.onAppear {
// 頁面出現(xiàn)獲取數(shù)據(jù)
loadData()
}
*/
}
}