Swift Academy · Leçon

État, action et réducteur

Modélisez les fonctionnalités comme des réducteurs purs agissant sur l’état.

État, action et réducteur est une leçon Swift Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Swift Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Swift Academy comprend 4 leçons au total.

Qu’est-ce que l’architecture composable ?

La Composable Architecture, ou TCA, est une bibliothèque destinée à créer des applications Swift avec une structure cohérente et vérifiable. Elle s’articule autour de trois éléments : State, qui décrit les données de votre fonctionnalité ; Action, qui décrit chaque événement susceptible de se produire ; et un Reducer, qui fait évoluer l’état en réponse aux actions.

Ce flux unidirectionnel rend les fonctionnalités prévisibles et faciles à vérifier.

import ComposableArchitecture

// State holds data, Action describes events,
// a Reducer turns (state, action) into the next state.

La macro @Reducer

Une fonctionnalité est définie comme un type annoté avec la macro @Reducer. La macro génère le code auxiliaire et vous permet de déclarer ensemble State, Action et le body du réducteur dans une seule unité cohérente.

Par convention, le type porte le nom de la fonctionnalité, comme CounterFeature.

import ComposableArchitecture

@Reducer
struct CounterFeature {
    // State, Action, and body go here
}

Définir State

State est généralement une structure qui contient toutes les données nécessaires à une fonctionnalité. Le fait de le marquer avec @ObservableState permet à SwiftUI d’observer précisément les changements et de réafficher uniquement ce qui est concerné.

Gardez l’état minimal et calculez les valeurs dérivées afin de disposer d’une source unique de vérité.

import ComposableArchitecture

@Reducer
struct CounterFeature {
    @ObservableState
    struct State: Equatable {
        var count = 0
    }
}

Définir les actions

Action est une énumération qui répertorie chaque événement que la fonctionnalité peut gérer : appuis de l’utilisateur, réponses, impulsions du minuteur, etc. Chaque cas désigne quelque chose qui s’est produit, et non une commande destinée à modifier directement l’état.

Des noms d’action clairs rendent le comportement de la fonctionnalité explicite.

import ComposableArchitecture

@Reducer
struct CounterFeature {
    @ObservableState
    struct State: Equatable { var count = 0 }

    enum Action {
        case incrementTapped
        case decrementTapped
    }
}

Le body du réducteur

La logique du réducteur se trouve dans une propriété calculée body qui renvoie un ReducerOf<Self>. À l’intérieur, vous utilisez Reduce avec une fermeture qui reçoit un state modifiable et l’action reçue.

Vous examinez l’action et modifiez l’état en conséquence.

import ComposableArchitecture

@Reducer
struct CounterFeature {
    @ObservableState
    struct State: Equatable { var count = 0 }
    enum Action { case incrementTapped, decrementTapped }

    var body: some ReducerOf<Self> {
        Reduce { state, action in
            switch action {
            case .incrementTapped:
                state.count += 1
                return .none
            case .decrementTapped:
                state.count -= 1
                return .none
            }
        }
    }
}

Renvoyer des effets

Chaque branche du réducteur doit renvoyer un Effect. Renvoyer .none signifie qu’aucun travail asynchrone supplémentaire ne doit être effectué après la modification de l’état.

Lorsque des effets de bord sont nécessaires, par exemple pour un appel réseau, vous renvoyez un effet qui exécute ce travail. Vous étudierez les effets dans une leçon ultérieure.

import ComposableArchitecture

// Every reducer branch returns an Effect.
// No side effect needed? Return .none.
// Need async work? Return an effect describing it.
Reduce { state, action in
    state.count += 1
    return .none
}

Les modifications d’état sont centralisées

Une règle essentielle de TCA veut que seul le réducteur modifie l’état, et uniquement en réponse aux actions. Les vues ne modifient jamais directement l’état ; elles envoient des actions.

Ce point central unique pour les modifications rend le flux de données facile à suivre et à vérifier.

import ComposableArchitecture

// Views send actions; the reducer mutates state.
// store.send(.incrementTapped)  ->  state.count += 1
// No direct state mutation outside the reducer.

Modéliser les entrées utilisateur dans State

Les fonctionnalités de type formulaire conservent les champs modifiables dans State et ajoutent des actions pour les changements. Le fait de marquer les propriétés avec des liaisons permet aux contrôles SwiftUI de les mettre à jour par l’intermédiaire d’actions, de manière sûre du point de vue des types.

Ici, une fonctionnalité suit un champ de texte et un bouton bascule.

import ComposableArchitecture

@Reducer
struct FormFeature {
    @ObservableState
    struct State: Equatable {
        var name = ""
        var isSubscribed = false
    }
    enum Action: BindableAction {
        case binding(BindingAction<State>)
    }
    var body: some ReducerOf<Self> {
        BindingReducer()
    }
}

Actions avec valeurs associées

Les actions peuvent transporter des données au moyen de valeurs associées. C’est ainsi que vous modélisez les résultats renvoyés, comme un élément chargé ou une erreur, afin que le réducteur puisse les enregistrer dans l’état.

Ici, une action de réponse transporte le nombre récupéré.

import ComposableArchitecture

@Reducer
struct NumberFeature {
    @ObservableState
    struct State: Equatable { var value = 0 }
    enum Action {
        case reloadTapped
        case responseReceived(Int)
    }
    var body: some ReducerOf<Self> {
        Reduce { state, action in
            switch action {
            case .reloadTapped:
                return .none
            case let .responseReceived(value):
                state.value = value
                return .none
            }
        }
    }
}

Pourquoi un état Equatable est utile

Rendre State conforme à Equatable permet à TCA de détecter si l’état a réellement changé, ce qui permet des mises à jour précises des vues et des vérifications exhaustives. C’est une petite exigence qui apporte de grands avantages.

La plupart des types d’état adoptent gratuitement Equatable, car leurs propriétés stockées le sont déjà.

import ComposableArchitecture

@ObservableState
struct State: Equatable {
    var count = 0
    var title = ""
}
// Equatable enables change detection and test assertions.

La structure d’une fonctionnalité complète

Une fonctionnalité terminée se lit de haut en bas : la macro, l’état observable, l’énumération des actions et le body du réducteur. Tout ce qui concerne la fonctionnalité se trouve dans un seul type, ce qui rend les fonctionnalités TCA composables et faciles à examiner.

Cette structure cohérente se répète dans toutes les fonctionnalités d’une application.

import ComposableArchitecture

@Reducer
struct CounterFeature {
    @ObservableState
    struct State: Equatable { var count = 0 }
    enum Action { case incrementTapped, decrementTapped }
    var body: some ReducerOf<Self> {
        Reduce { state, action in
            switch action {
            case .incrementTapped: state.count += 1; return .none
            case .decrementTapped: state.count -= 1; return .none
            }
        }
    }
}

Vérification rapide : les trois éléments

Rappelez-vous les rôles de State, Action et Reducer dans TCA.

Récapitulatif : State, Action et Reducer

Vous avez découvert le cœur d’une fonctionnalité TCA :

@Reducer définit un type de fonctionnalité qui contient tout au même endroit.
@ObservableState sur une structure contient les données de la fonctionnalité et permet une observation précise.
Une énumération Action répertorie chaque événement, éventuellement avec des valeurs associées.
Le body du réducteur utilise Reduce pour modifier l’état et renvoyer un Effect, avec .none lorsqu’aucun effet de bord n’est nécessaire.
Seul le réducteur modifie l’état, ce qui garantit un flux de données prévisible.

Vous allez maintenant connecter cette fonctionnalité à SwiftUI avec un store.

import ComposableArchitecture

// Recap: @Reducer + State + Action + body(Reduce)
// One type, one source of truth, predictable updates.

Questions Fréquemment Posées

La leçon « État, action et réducteur » est-elle gratuite ?

Oui — le texte complet de « État, action et réducteur » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Swift Academy, passe à CoddyKit PRO. Le cours Swift Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « État, action et réducteur » ?

Modélisez les fonctionnalités comme des réducteurs purs agissant sur l’état. Tu pratiques Swift Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer Swift Academy ?

Aucune expérience préalable n'est requise. Swift Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.

Combien de temps prend la leçon « État, action et réducteur » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon Swift Academy ?

Oui. Chaque leçon Swift Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à Swift Academy