ホームページ >ウェブフロントエンド >フロントエンドQ&A >vue の mvvm と mvc の違いは何ですか

vue の mvvm と mvc の違いは何ですか

青灯夜游
青灯夜游オリジナル
2022-12-27 17:59:232311ブラウズ

mvvm と mvc の違い: 1. mvvm の各部分間の通信は双方向ですが、mvc の各部分間の通信は一方向です。 2. MVVM はビューとモデルの自動同期を実現するため、モデルの属性が変更された場合、手動で dom 要素を操作してビューの表示を変更する必要はなく、属性変更後にビュー層を変更します。属性に対応する値は自動的に変更されます。

vue の mvvm と mvc の違いは何ですか

#このチュートリアルの動作環境: Windows7 システム、vue3 バージョン、DELL G3 コンピューター。

MVC とは


#MVC はデザイン パターンです:


M (モデル):

モデル層。 は、アプリケーション データ ロジックの処理に使用されるアプリケーションの一部です。モデル オブジェクトは、データベース内のデータへのアクセスを担当します。V (ビュー):
ビュー レイヤー。 は、データ表示を処理するアプリケーションの一部です。ビューは、モデル データ; C (コントローラー):
に基づいて作成されます。 制御層。 は、ユーザー操作を処理するアプリケーションの一部です。コントローラーはユーザー入力を受け入れ、モデルとビューを呼び出してユーザーのニーズを満たします。コントローラー自体は何も出力したり、処理を実行したりしません。リクエストを受信し、リクエストを処理するためにどのモデル コンポーネントを呼び出すかを決定し、返されたデータを表示するためにどのビューを使用するかを決定するだけです。

vue の mvvm と mvc の違いは何ですか

vue の mvvm と mvc の違いは何ですか

MVVM とは

MVVM とはvue フレームワーク M はバックエンド データ、V はノード ツリー、VM は新しい Vue({}) オブジェクトです。


M (モデル): モデル層。 はビジネスロジックに関わるデータオブジェクトで、通常はデータベースからマッピングされるもので、データベースに対応するモデルと言えます。
V (ビュー): レイヤーを表示します。 は表示されるユーザー インターフェイスです。
VM (ViewModel): ビュー モデル レイヤー。 ビューとモデルをつなぐ橋。多くの場合、モデル レイヤー内のデータはビュー内のコントロールに直接対応できないため、ビュー上のコントロールに明確に対応する別のデータ オブジェクトを定義する必要があります。 ViewModel の役割は、モデル オブジェクトを、表示および入力の受け入れが可能なインターフェイス データ オブジェクトにカプセル化することです。

vue の mvvm と mvc の違いは何ですか

View と ViewModel は双方向バインディングを通じて接続されているため、View (ビュー レイヤ) が変更されると自動的に更新されます。 ViewModel (ViewModel) へ、またはその逆。

vue の mvvm と mvc の違いは何ですか

MVVM1、mvc、mvvm の利点それはすべてデザイン上のアイデアです。重要なことは、mvc のコントローラーが mvvm の viewModel に進化することです。 mvvm は主に、mvc での多数の DOM 操作によってページのレンダリングのパフォーマンスが低下し、読み込み速度が遅くなるという問題を解決します。

2. MVVM と MVC の最大の違いは、View と Model の自動同期を実現していることです: Model のプロパティが変更された場合、

Dom 要素を手動で操作する必要がなくなりましたビューを変更するには 表示 が自動的に変更されます。 3. 全体的に、MVVM は MVC よりもはるかに単純なので、DOM を頻繁に操作するためにセレクターを使用する必要がなくなりました。

MVVM は C を完全に VM に置き換えるものではありません。ViewModel の目的は、コントローラーに表示されるビジネス ロジックを抽出することであり、コントローラーを置き換えることではありません。他のビュー操作サービスも引き続き配置する必要があります。コントローラーに を実装します。

MVC と MVVM の違いは何ですか


違い 1:

さまざまな間の通信mvvm の部分 MVC のさまざまな部分間の通信は一方向であるのに対し、これは双方向です。

違い 2:

MVVM と MVC の最大の違いは、View と Model の自動同期を実現することです

    Model プロパティが変更された場合、View の表示を変更するために Dom 要素を手動で操作する必要はありません。
  • 属性を変更すると、その属性に対応するビューの表示が自動的に変わります。

MVVM 応答原則


  • vue は データ ハイジャックを使用してパブリッシャー/サブスクライバー モデルと連携します方法,
    • 各プロパティのゲッターとセッターを Object.defineProperty() を通じて 乗っ取ります。
    • データが変更されたときに、依存関係コレクター (dep subs 内) にメッセージをパブリッシュします。 )、オブザーバーに通知し、対応するコールバック関数を作成し、ビューを更新します。
  • MVVM は、オブザーバー、コンパイル、ウォッチャーのバインド、統合のエントリ ポイントとして機能します。
    • Observer を使用してモデル データの変更を監視します。
    • Compile を使用してテンプレート命令を解析およびコンパイルします。
    • 最後に Watcher を使用して Observer と Compile 間の通信ブリッジを構築します。
    • 達成データ変更オブザーバー) =>更新の表示; 対話型変更の表示 =>データ モデルの変更の双方向バインディング効果。

[関連する推奨事項: vuejs ビデオ チュートリアルWeb フロントエンド開発]

以上がvue の mvvm と mvc の違いは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。