SwiftUI Academy · Pelajaran

Menghubungkan Tampilan ke ViewModels

Kendalikan tampilan dari properti view model.

Menghubungkan Tampilan ke ViewModels adalah pelajaran SwiftUI Academy gratis di CoddyKit. Ini adalah pelajaran 3 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar SwiftUI Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Bagian dari pelajaran ini belum diterjemahkan dan ditampilkan dalam bahasa Inggris.

Owning the ViewModel

The view that creates a ViewModel owns it. Use @State to hold the instance so it survives across re-renders of the view.

@State private var vm = ProfileViewModel()

Reading State in body

Inside body, read the ViewModel properties like normal values. SwiftUI re-runs body whenever those observed properties change.

Text(vm.greeting)

Calling Actions on Tap

Wire a button action straight to a ViewModel method. The view stays simple, just forwarding the intent to the brain.

Button("Reload") {
    vm.load()
}

Driving Conditional UI

Let ViewModel state choose the layout. Switch on isLoading to show a spinner or the content with no extra view logic.

if vm.isLoading {
    ProgressView()
} else {
    Text(vm.greeting)
}

Two-Way Fields

For text input, bind a TextField to a ViewModel property with the dollar sign. Edits flow back into the ViewModel instantly.

TextField("Name", text: $vm.name)

Loading When the View Appears

Use the .task modifier to call the ViewModel as the view shows up, kicking off the first data load automatically.

.task {
    await vm.load()
}

Lists From the ViewModel

Feed a List from a ViewModel array. When the model updates its items, SwiftUI diffs the rows and animates the change for you.

List(vm.items) { item in
    Text(item.title)
}

Keep the View Declarative

A well-bound view reads like a sentence: show this state, run that action. No calculations sneak into the body.

Passing the ViewModel Down

Child views can take a ViewModel as a plain property. The parent owns it; children just read and call its methods.

DetailView(vm: vm)

Previews Love ViewModels

In a preview, hand the view a ViewModel filled with sample data. You can showcase loading, empty, and full states side by side. 👀

A Bound Screen at a Glance

This view owns a ViewModel, shows its greeting, and reloads on tap, a complete binding in just a few lines of SwiftUI.

Text(vm.greeting)
Button("Reload") { vm.load() }

Quick Check

How should a view own a fresh ViewModel instance?

Recap: Binding Views to ViewModels

You connected a view to its ViewModel with @State, read its properties in body, and routed taps and input back to it. Next: dependency injection.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Menghubungkan Tampilan ke ViewModels” gratis?

Ya — teks lengkap “Menghubungkan Tampilan ke ViewModels” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus SwiftUI Academy, upgrade ke CoddyKit PRO. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Menghubungkan Tampilan ke ViewModels”?

Kendalikan tampilan dari properti view model. Kamu berlatih SwiftUI Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai SwiftUI Academy?

Tidak diperlukan pengalaman sebelumnya. SwiftUI Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 4.

Berapa lama pelajaran “Menghubungkan Tampilan ke ViewModels” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran SwiftUI Academy ini?

Ya. Setiap pelajaran SwiftUI Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

← Kembali ke SwiftUI Academy