SwiftUI Academy · Lección

Diseñar un ViewModel

Cree un view model @Observable para una pantalla.

Lección 2 de 413 pasos

Diseñar un ViewModel es una lección gratuita de SwiftUI Academy en CoddyKit. Esta es la lección 2 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de SwiftUI Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de SwiftUI Academy incluye 4 lecciones en total.

Partes de esta lección aún no han sido traducidas y se muestran en inglés.

A ViewModel Is Just a Class

A ViewModel is usually a class that holds the state and logic for one screen. Using a class lets several views share the same live instance.

class ProfileViewModel {
    var name: String = ""
}

Make It Observable

Add the @Observable macro so SwiftUI tracks property changes and re-renders the view automatically when state updates.

@Observable
class ProfileViewModel {
    var name = ""
}

Expose View-Ready State

Give the ViewModel properties the view can read directly, like a formatted greeting, so the view never does its own string building.

var greeting: String {
    "Hi, " + name
}

Hold the Loading Flag

Track UI status inside the ViewModel. A simple isLoading boolean lets the view decide when to show a spinner versus content.

var isLoading = false

Keep Intent in Methods

Expose actions as methods like load() or save(). The view calls them on tap; the ViewModel decides exactly what happens.

func load() {
    isLoading = true
}

Name Properties for the UI

Name state after what the screen shows, like buttonTitle or rows, not after raw data. This keeps the view almost declarative.

Hide the Messy Details

Parsing, math, and edge cases belong inside the ViewModel. The view should see clean values and never touch the rough work.

One ViewModel per Screen

Give each screen its own focused ViewModel. A small, single-purpose model is far easier to read, reason about, and test.

Start Empty, Then Fill

Initialize the ViewModel with sensible empty defaults, then populate it when data arrives. The view shows a calm empty state meanwhile.

Avoid View Code Inside

Never import view types or layout code into a ViewModel. Keeping it UI-free is what makes it portable and easy to unit test. ✨

A Complete Small Example

This tiny ViewModel exposes a count and a method to change it, giving the view everything it needs in two clear members.

@Observable
class CounterViewModel {
    var count = 0
    func increment() { count += 1 }
}

Quick Check

Which macro makes a ViewModel class trigger SwiftUI updates?

Recap: Designing a ViewModel

You built an @Observable class that exposes view-ready state and intent methods while hiding the messy details. Next you will bind views to it.

Gratis para empezar

Aprende Swift con un tutor de IA — gratis

Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.

Cursos
30
Lecciones
120

Preguntas frecuentes

¿La lección «Diseñar un ViewModel» es gratis?

Sí — el texto completo de «Diseñar un ViewModel» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de SwiftUI Academy, actualiza a CoddyKit PRO. El curso de SwiftUI Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Diseñar un ViewModel»?

Cree un view model @Observable para una pantalla. Practicas SwiftUI Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar SwiftUI Academy?

No se requiere experiencia previa. SwiftUI Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 4.

¿Cuánto tiempo toma la lección «Diseñar un ViewModel»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de SwiftUI Academy?

Sí. Cada lección de SwiftUI Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

  1. Por qué MVVM encaja con SwiftUI
  2. Diseñar un ViewModel
  3. Vincular vistas a ViewModels
  4. Inyección de dependencias para ViewModels
← Volver a SwiftUI Academy