Quelle est la différence entre le modèle de conception MVC, MVP et MVVM en termes de codage c #

202

Si nous recherchons sur Google en utilisant la phrase "Quelle est la différence entre le modèle de conception MVC, MVP et MVVM", nous pouvons obtenir quelques URL qui discutent de la différence entre le modèle de conception MVC MVP et MVVM comme théoriquement :

MVP

Utilisez dans les situations où la liaison via un datacontext n'est pas possible. Windows Forms en est un parfait exemple. Afin de séparer la vue du modèle, un présentateur est nécessaire. Comme la vue ne peut pas se lier directement au présentateur, les informations doivent être transmises à la vue via une interface (IView).

MVVM

À utiliser dans les situations où une liaison via un contexte de données est possible. Pourquoi? Les différentes interfaces IView de chaque vue sont supprimées, ce qui signifie moins de code à maintenir. Quelques exemples où MVVM est possible incluent les projets WPF et javascript utilisant Knockout.

MVC

À utiliser dans des situations où la connexion entre la vue et le reste du programme n'est pas toujours disponible (et vous ne pouvez pas utiliser efficacement MVVM ou MVP). Cela décrit clairement la situation dans laquelle une API Web est séparée des données envoyées aux navigateurs clients. ASP.NET MVC de Microsoft est un excellent outil pour gérer de telles situations et fournit un cadre MVC très clair


Mais je n'ai pas trouvé un seul article qui discute théoriquement de la différence avec un exemple de code.

Ce serait vraiment bien si je reçois un article qui discute de la différence entre ces 3 modèles de conception (MVC, MVP et MVVM) avec du code.

Je voudrais mettre la main sur le code source de 3 applications CRUD similaires qui ont été implémentées par ces trois modèles de conception (MVC, MVP et MVVM). Pour que je puisse parcourir le code et comprendre comment écrire du code pour ces trois modèles de conception (MVC, MVP et MVVM).

Donc, si un tel article existe qui explique comment le code serait différent pour ces 3 modèles de conception (MVC, MVP et MVVM), veuillez me rediriger vers cet article.

Thomas
la source
14
Dans le TechEd 2011, il y avait une bonne mais simple présentation de ces 3 modèles. L'orateur a créé et montré des exemples sur le même modèle commercial à l'aide de C # et de Visual Studio. Voici la vidéo de Channel9 MVC, MVP et MVVM: une comparaison des modèles architecturaux
Marco Medrano
2
Voici l'article: realm.io/news/eric-maxwell-mvc-mvp-and-mvvm-on-android . IMO très bien écrit et clair. Il a également un dépôt Github avec une branche pour chaque motif.
cuddlecheek
C'était intéressant: cirw.in/blog/time-to-move-on
Andrew

Réponses:

100

Quelques différences de base peuvent être écrites en bref:

MVC:

MVC traditionnel est là où il y a un

  1. Modèle: sert de modèle pour les données
  2. Vue: traite de la vue de l'utilisateur qui peut être l'interface utilisateur
  3. Contrôleur: contrôle l'interaction entre le modèle et la vue, où la vue appelle le contrôleur pour mettre à jour le modèle. View peut appeler plusieurs contrôleurs si nécessaire.

MVP:

Similaire au MVC traditionnel, mais Controller est remplacé par Presenter. Mais le présentateur, contrairement au contrôleur, est également responsable de la modification de la vue. La vue n'appelle généralement pas le présentateur.

MVVM

La différence ici est la présence de View Model. C'est une sorte d'implémentation d'Observer Design Pattern, où les changements dans le modèle sont également représentés dans la vue par la VM. Par exemple: si un curseur est modifié, non seulement le modèle est mis à jour, mais les données qui peuvent être un texte, qui sont affichées dans la vue sont également mises à jour. Il existe donc une liaison de données bidirectionnelle.

Pritam Banerjee
la source
1
Petit détail - vous pouvez choisir s'il s'agit d'une liaison de données bidirectionnelle ou définir également une liaison unidirectionnelle.
Jviaches
10
"La vue n'appelle généralement pas le présentateur"? pouvez-vous expliquer plus sur cette phrase? si ui view ne va pas appeler le présentateur qui va?
Amir Ziarati
3
@AmirZiarati Le présentateur garde un œil sur les événements. En cas d'événements, le présentateur entre en jeu et prend les mesures nécessaires.
Pritam Banerjee
oui tant qu'il a une référence à voir. Je me suis trompé, je pensais que vous vouliez dire que la vue n'avait même pas besoin d'appeler un présentateur au début alors qu'elle devrait au moins une fois. merci;)
Amir Ziarati
1
@PritamBanerjee, D'après l'explication, MVP et MVVM ont presque la même fonctionnalité. P ou VM mettent à jour les deux M & V.
Manohar Reddy Poreddy
43

MVC, MVP, MVVM

MVC (ancien)

MVP (plus modulaire en raison de son faible couplage. Le présentateur est un médiateur entre la vue et le modèle)

MVVM (Vous avez déjà une liaison bidirectionnelle entre VM et le composant UI, il est donc plus automatisé que MVP) entrez la description de l'image ici

Une autre image: entrez la description de l'image ici

Uddhav Gautam
la source
24
S'il vous plaît, ne copiez pas seulement des images - surtout lorsqu'elles ne sont pas d'accord entre elles. Voir MVC (l'ancien que vous ne voyez pas), le navigateur parle pour voir dans l'image du haut, mais parle au contrôleur dans l'image inférieure.
peter.fr
1
@UddhavGautam Son bit est déroutant car la première image montre View comme point d'entrée et la seconde montre Controller.
everlasto
1
Dans le premier diagramme, quelle est la différence entre MVVM et MVP? Selon moi, ce ne sont que les liens entre le V et le VM / P. Qui dans un cas a les messages de va-et-vient comme une liaison bidirectionnelle et dans l'autre ils sont représentés comme deux liaisons unidirectionnelles. Je ne vois aucune différence fonctionnelle entre eux. Qu'est-ce que je rate?
iCyberPaul
1
Navigateur signifie l'utilisateur d'où l'interaction se produit entre vous et l'application.
Uddhav Gautam
4
Intrigue: personne ne sait vraiment ce qui se passe. Ils sont tous en fait exactement la même chose. Haha. Non mais vraiment, même avec ces images "utiles", il est difficile de comprendre ce qui se passe. Je pense que cela fait partie du problème / de la confusion.
Andrew
34

Grande explication depuis le lien: http://geekswithblogs.net/dlussier/archive/2009/11/21/136454.aspx

Voyons d'abord MVC

L'entrée est dirigée vers le contrôleur en premier, pas vers la vue. Cette entrée peut provenir d'un utilisateur interagissant avec une page, mais elle peut également provenir de la simple saisie d'une URL spécifique dans un navigateur. Dans les deux cas, c'est un contrôleur qui est interfacé pour lancer certaines fonctionnalités.

Il existe une relation plusieurs-à-un entre le contrôleur et la vue. En effet, un seul contrôleur peut sélectionner différentes vues à rendre en fonction de l'opération en cours d'exécution.

Il y a une flèche à sens unique du contrôleur vers la vue. En effet, la vue n'a aucune connaissance ni référence au contrôleur.

Le contrôleur transmet le modèle, il y a donc une connaissance entre la vue et le modèle attendu qui lui est transmis, mais pas le contrôleur qui le sert.

MVP - Model View Presenter

Examinons maintenant le modèle MVP. Il ressemble beaucoup à MVC, à l'exception de quelques distinctions clés:

L'entrée commence par la vue, pas le présentateur.

Il existe un mappage un à un entre la vue et le présentateur associé.

La vue contient une référence au présentateur. Le présentateur réagit également aux événements déclenchés à partir de la vue, de sorte qu'il est conscient de la vue qui lui est associée.

Le présentateur met à jour la vue en fonction des actions demandées qu'il exécute sur le modèle, mais la vue n'est pas compatible avec le modèle.

MVVM - Modèle Voir le modèle

Donc, avec les modèles MVC et MVP devant nous, regardons le modèle MVVM et voyons quelles différences il contient:

L'entrée commence par la vue et non par le modèle de vue.

Alors que la vue contient une référence au modèle de vue, le modèle de vue ne contient aucune information sur la vue. C'est pourquoi il est possible d'avoir un mappage un-à-plusieurs entre différentes vues et un seul modèle de vue… même entre les technologies. Par exemple, une vue WPF et une vue Silverlight peuvent partager le même modèle de vue.

taha027
la source
7
"C'est parce que la Vue n'a aucune connaissance ou référence au contrôleur" Ce n'est pas vrai
Adam Wolski
@AmirZiarati ViewModel ne fait pas partie du modèle MVP mais MVVM.
Joe
Je serais bien si vous fournissez des exemples comme où pourrions-nous utiliser ces modèles
JKA
3

L'image ci-dessous est extraite de l' article écrit par Erwin van der Valk:

image expliquant MVC, MVP et MVVM - par Erwin Vandervalk

L' article explique les différences et donne quelques exemples de code en C #

Jboy Flaga
la source
Les images ci-dessus ne prêtent pas à confusion, comme dans MVC pourquoi VIEW accédant directement au modèle? pareil pour les autres?
smkrn110
Dans ces diagrammes, la signification des flèches n'est pas claire. La flèche signifie-t-elle accès ou manipulation? Dans le diagramme MVC, il n'est pas clair pourquoi il n'y a pas de flèche
commençant à