Swift Academy · Aula

Vinculação de Modelos de View a Views

Conecte modelos de view com SwiftUI e Combine.

Aula 2 de 413 etapas

Vinculação de Modelos de View a Views é uma aula grátis de Swift Academy no CoddyKit. Esta é a aula 2 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Swift Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Swift Academy inclui 4 aulas no total.

Conectando o ViewModel à visualização

Um ViewModel só é útil quando a Visualização reage às suas alterações. No SwiftUI, essa reatividade é impulsionada pelos contêineres de propriedades baseados em Combine @Published, @StateObject e @ObservedObject.

Juntos, eles formam uma vinculação automática: quando o ViewModel muda, a Visualização é renderizada novamente.

ObservableObject

Para ser observado pelo SwiftUI, um ViewModel deve estar em conformidade com ObservableObject. Esse protocolo fornece um publicador objectWillChange que dispara antes de qualquer alteração.

final class CounterViewModel: ObservableObject {
    @Published var count: Int = 0

    func increment() {
        count += 1
    }
}

Propriedades @Published

Marcar uma propriedade com @Published emite automaticamente uma notificação de alteração sempre que seu valor é definido.

Cada propriedade @Published alimenta o publicador objectWillChange do objeto, para que a Visualização saiba exatamente quando atualizar.

final class SearchViewModel: ObservableObject {
    @Published var query: String = ""
    @Published var results: [String] = []
}

@StateObject

@StateObject diz a uma Visualização para criar e ser proprietária de um ViewModel. O SwiftUI o instancia uma vez e o mantém vivo durante as novas renderizações dessa Visualização.

Use @StateObject onde o ViewModel é criado pela primeira vez.

struct CounterView: View {
    @StateObject private var viewModel = CounterViewModel()

    var body: some View {
        Button("Count: \(viewModel.count)") {
            viewModel.increment()
        }
    }
}

@ObservedObject

@ObservedObject é usado para um ViewModel que foi criado em outro lugar e passado para a Visualização. A Visualização o observa, mas não controla seu ciclo de vida.

Use-o para visualizações filhas que recebem um ViewModel de uma visualização pai.

struct BadgeView: View {
    @ObservedObject var viewModel: CounterViewModel

    var body: some View {
        Text("Total: \(viewModel.count)")
    }
}

StateObject versus ObservedObject

A diferença fundamental é a propriedade:

@StateObject — a Visualização é proprietária; sobrevive a novas renderizações
@ObservedObject — é passado para ela; a Visualização não é proprietária

Usar @ObservedObject onde você deveria usar @StateObject pode fazer o objeto ser recriado e perder seu state a cada atualização do pai.

Repassando um ViewModel

Crie o ViewModel uma vez com @StateObject na visualização pai e depois passe-o para as filhas, que o marcarão com @ObservedObject.

struct ParentView: View {
    @StateObject private var viewModel = CounterViewModel()

    var body: some View {
        VStack {
            BadgeView(viewModel: viewModel)
            Button("Add") { viewModel.increment() }
        }
    }
}

Vinculações bidirecionais

Para entradas como campos de texto, você precisa de uma vinculação bidirecional. O SwiftUI gera uma a partir de uma propriedade @Published usando o prefixo $ no wrapper.

struct SearchView: View {
    @StateObject private var viewModel = SearchViewModel()

    var body: some View {
        TextField("Search", text: $viewModel.query)
    }
}

Controlando o state da interface

A Visualização deve derivar tudo o que exibe de propriedades publicadas. Indicadores de carregamento, avisos de erro e conteúdo fluem todos do state do ViewModel.

final class FeedViewModel: ObservableObject {
    enum State { case loading, loaded([String]), error(String) }
    @Published var state: State = .loading
}

Reagindo ao state

A Visualização consulta o state do ViewModel para renderizar a interface correta. Não há código imperativo para mostrar ou ocultar elementos, apenas um mapeamento declarativo.

struct FeedView: View {
    @StateObject var viewModel = FeedViewModel()
    var body: some View {
        switch viewModel.state {
        case .loading: ProgressView()
        case .loaded(let items): List(items, id: \.self) { Text($0) }
        case .error(let message): Text(message)
        }
    }
}

Mantendo as atualizações na linha de execução principal

O SwiftUI exige que alterações publicadas ocorram na linha de execução principal. Quando um ViewModel atualiza o state após um trabalho assíncrono, anote-o com @MainActor para garantir isso.

@MainActor
final class ProfileViewModel: ObservableObject {
    @Published var name: String = ""

    func load() async {
        name = await fetchName()
    }
}

Verificação rápida

Teste seus conhecimentos sobre vinculações.

Responda na aula interativa

Recapitulação

Você conectou ViewModels a visualizações usando vinculações do SwiftUI:

ObservableObject + @Published emitem notificações de alteração
@StateObject cria e é proprietário de um ViewModel
@ObservedObject observa um ViewModel recebido
@MainActor mantém as atualizações assíncronas na linha de execução principal

Com as vinculações reativas estabelecidas, a Visualização sempre reflete automaticamente o state mais recente do ViewModel.

Grátis para começar

Aprenda Swift com um tutor de IA — grátis

Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.

Cursos: 122
Aulas: 409

Começar a aprender grátis Ver o curso completo

Perguntas Frequentes

A aula “Vinculação de Modelos de View a Views” é grátis?

Sim — o texto completo de “Vinculação de Modelos de View a Views” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Swift Academy, atualize para CoddyKit PRO. O curso de Swift Academy inclui 4 aulas no total.

O que vou aprender em “Vinculação de Modelos de View a Views”?

Conecte modelos de view com SwiftUI e Combine. Você pratica Swift Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar Swift Academy?

Nenhuma experiência prévia é necessária. Swift Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 2 de 4.

Quanto tempo leva a aula “Vinculação de Modelos de View a Views”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de Swift Academy?

Sim. Cada aula de Swift Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

O Padrão MVVM
Vinculação de Modelos de View a Views
O Padrão Coordinator
Testes de Modelos de View

← Voltar para Swift Academy