Cette page couvre Elm 0.18

Composition

Ci-dessous deux diagrammes qui illustrent cette architecture :

Affichage initial

Flow

(1) program appelle Main.initialModel pour obtenir le modèle initial de l'application.

(2) Main appelle Widget.initialModel

(3) Widget retourne son modèle initial

(4) Main retourne un modèle principal composé, qui inclut le modèle du widget

(5) program appelle Main.view en lui passant le modèle principal mainModel

(6) Main.view appelle Widget.view, en lui passant widgetModel du modèle principal

(7) Widget.view retourne l'Html calculé à Main

(8) Main.view retourne l'Html calculé à program

(9) program affiche le tout dans le navigateur.


Interactions avec l'utilisateur

Flow

(1) L'utilisateur clique sur le bouton increase.

(2) Widget.view émet un message Increase qui est récupéré par Main.view.

(3) Main.view étiquette ce message de manière à ce qu'il devienne WidgetMsg Increase et il est ensuite envoyé à program

(4) program appelle Main.update avec ce message et le modèle principal

(5) Puisque le message a été étiqueté avec WidgetMsg, Main.update délègue la mise à jour à Widget.update, qu'il prend soin d'appeler avec la partie widgetModel du modèle principal

(6) Widget.update modifie le modèle en fonction du message reçu, dans notre cas, Increase. Il retourne ensuite le widgetModel modifié plus une commande

(7) Main.update met à jour le modèle principal et le retourne à program

(8) Ensuite program affiche de nouveau la vue en passant le modèle principal mis à jour

Points clés

  • L'architecture Elm offre une manière propre de composer (ou d'imbriquer) des éléments sur autant de niveaux qu'on le souhaite.
  • Les composants enfants n'ont pas besoin de connaitre quoi que ce soit du parent. Ils définissent leurs propres types et leurs propres messages.
  • Si un composant enfant à besoin de quelque chose en particulier (par exemple, un modèle additionnel), il le « demande » en utilisant les signatures de fonction. C'est le parent qui a la responsabilité de fournir ce dont l'enfant a besoin.
  • Un parent n'a pas besoin de savoir ce qui se passe dans les modèles de ses enfants, ou quels sont leurs messages. Il a juste en charge de fournir ce que les enfants demandent.

results matching ""

    No results matching ""