Async Data Loading dengan .task — CompileDaily Study

Penjelasan

Untuk memuat data dari network atau sumber asynchronous lain tepat saat sebuah View pertama kali muncul di layar, SwiftUI menyediakan modifier .task { ... }. Berbeda dari .onAppear (yang sinkron), closure di dalam .task berjalan dalam konteks async, sehingga kamu bisa langsung memakai await tanpa perlu Task { } tambahan secara manual. SwiftUI juga otomatis membatalkan (cancel) task tersebut kalau View menghilang dari layar sebelum task selesai — mencegah race condition seperti memperbarui state pada View yang sudah tidak ada. Pola umumnya: fungsi pengambil data ditandai async throws, dipanggil dengan await di dalam .task, hasilnya disimpan ke @State (atau @Published pada ObservableObject), dan bagian body menampilkan kondisi loading/error/sukses berdasarkan state itu.

Contoh Konsep

import SwiftUI

struct Artikel: Decodable, Identifiable {
    let id: Int
    let judul: String
}

struct DaftarArtikelView: View {
    @State private var artikel: [Artikel] = []
    @State private var sedangMemuat = true

    var body: some View {
        List(artikel) { item in
            Text(item.judul)
        }
        .overlay {
            if sedangMemuat { ProgressView() }
        }
        .task {
            await muatArtikel()
        }
    }

    func muatArtikel() async {
        guard let url = URL(string: "https://api.contoh.com/artikel") else { return }
        do {
            let (data, _) = try await URLSession.shared.data(from: url)
            artikel = try JSONDecoder().decode([Artikel].self, from: data)
        } catch {
            print("Gagal memuat: \(error)")
        }
        sedangMemuat = false
    }
}

Praktikum

Buat fungsi async bernama muatProfil() yang mensimulasikan delay dengan try? await Task.sleep(nanoseconds: 1_000_000_000) lalu mengubah @State private var nama menjadi "Budi". Panggil fungsi ini dari modifier .task pada body.

Editor Latihan

Ketik/edit bebas di sini untuk latihan — kode ini tidak dijalankan.

Tips

Modifier .task menerima parameter id: opsional — kalau nilainya berubah, task lama otomatis dibatalkan dan task baru dijalankan ulang. Ini berguna kalau data yang dimuat bergantung pada parameter yang bisa berubah, misalnya ID item yang sedang dilihat pengguna.