개발/SWIFT 아이폰 / / 2023. 7. 17. 12:16

SwiftUI 리스트 생성 시 외부 API 데이터

반응형

리스트 생성 시 외부 API로 데이터를 가져온다면

struct ContentView: View {
    @State private var items: [Item] = [] // 외부 API로부터 받아온 목록을 저장할 배열
    
    var body: some View {
        VStack {
            List(items, id: \.id) { item in
                VStack(alignment: .leading) {
                    Text(item.title)
                        .font(.headline)
                    Text(item.description)
                        .font(.subheadline)
                        .foregroundColor(.gray)
                }
            }
            .onAppear {
                // 외부 API로부터 목록을 가져와서 items 배열에 저장
                fetchData()
            }
        }
    }
    
    func fetchData() {
        // 외부 API로부터 데이터를 가져오는 비동기 작업 수행
        // 이 예시에서는 간략하게 Mock 데이터를 사용하겠습니다.
        
        // 외부 API 호출 및 데이터 처리
        let mockItems = [
            Item(id: 1, title: "아이템 1", description: "아이템 1 설명"),
            Item(id: 2, title: "아이템 2", description: "아이템 2 설명"),
            Item(id: 3, title: "아이템 3", description: "아이템 3 설명")
        ]
        
        // 가져온 데이터를 items 배열에 저장
        DispatchQueue.main.async {
            self.items = mockItems
        }
    }
}

struct Item: Identifiable {
    let id: Int
    let title: String
    let description: String
}

 

외부 데이터를 다른 클래스로 생성

class DataFetcher {
    func fetchData(completion: @escaping ([Item]) -> Void) {
        // 외부 API 호출 및 데이터 처리
        let mockItems = [
            Item(id: 1, title: "아이템 1", description: "아이템 1 설명"),
            Item(id: 2, title: "아이템 2", description: "아이템 2 설명"),
            Item(id: 3, title: "아이템 3", description: "아이템 3 설명")
        ]
        
        // 비동기 작업이 완료되었을 때 완료 핸들러 호출
        DispatchQueue.main.async {
            completion(mockItems)
        }
    }
}

struct ContentView: View {
    @State private var items: [Item] = [] // 외부 API로부터 받아온 목록을 저장할 배열
    
    var body: some View {
        VStack {
            List(items, id: \.id) { item in
                VStack(alignment: .leading) {
                    Text(item.title)
                        .font(.headline)
                    Text(item.description)
                        .font(.subheadline)
                        .foregroundColor(.gray)
                }
            }
            .onAppear {
                // DataFetcher 인스턴스 생성
                let dataFetcher = DataFetcher()
                
                // fetchData 메서드 호출하여 외부 API로부터 데이터 가져오기
                dataFetcher.fetchData { fetchedItems in
                    // 외부 API로부터 받아온 데이터를 items 배열에 저장
                    self.items = fetchedItems
                }
            }
        }
    }
}

struct Item: Identifiable {
    let id: Int
    let title: String
    let description: String
}

 

반응형
  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유
  • 카카오스토리 공유