[解決済み] MVVMの基本概念--ViewModelは何をすべきなのか?
質問
MVVMのコンセプトを理解するために、すでにいくつかのブログを読み、いくつかのプロジェクトを見てきました。
私が理解したところでは ビュー は馬鹿で、渡されたものをどのように表示するかを知っているだけです。
モデル は単なるプレーンなデータであり ビューモデル はその間のパディングのような役割を果たすものであり、その情報を モデル から情報を取得し、それを ビュー に渡し、さらに ビュー はそれをどのように表示するかを知っている必要があります。またはその逆で、もし ビュー の情報が変更された場合、その変更を モデル .
しかし、この概念をどのように適用すればよいのか、まだわかりません。どなたか、コンセプトを把握できるように、非常に簡単なシナリオを説明していただけないでしょうか。すでにいくつかのプロジェクトを見てきましたが、まだ完全に理解できていないので、どなたかわかりやすく書いていただけると助かります。
どのように解決するのですか?
このように考えたいですね。
ビューは、あなたが言うように、ダムです。ジョシュ・スミス(Josh Smith)は、代表的な、しばしばリンクされる MSDN の記事 ビューは、実際にデータを含むことも、直接操作することもなく、ただビューモデルのプロパティとコマンドにバインドされているだけです。
モデルとは アプリケーションのドメイン ビジネスオブジェクトのようなものです。あなたのアプリケーションは音楽店でしょうか?おそらく、あなたのモデルオブジェクトは、アーティスト、アルバム、および曲でしょう。あなたのアプリケーションは、組織図ブラウザでしょうか?おそらく、モデルオブジェクトはマネージャーと従業員でしょう。モデルオブジェクトは、視覚的なレンダリングとは関係ありませんし、アプリケーションに直接関係するものでもありません。モデルオブジェクトは、ある種のドメインを表現するオブジェクト群として、それ自体で完全に意味を成すものでなければなりません。モデル層はまた、一般的にサービス アクセッサーのようなものを含んでいます。
ここでビューモデルにたどり着きます。ビューモデルとは何でしょうか?ビューモデルは GUI アプリケーション つまり、ビューで使用されるデータや機能を提供するオブジェクトです。これらは、あなたが構築している実際のアプリケーションの構造と動作を定義するものです。モデルオブジェクトの場合、ドメインはあなたが選んだどんなドメインでも構いませんが(ミュージックストア、オルグチャートブラウザなど)、ビューモデルの場合、ドメインはグラフィカルなアプリケーションになります。ビューモデルはアプリケーションが行う全ての動作とデータをカプセル化することになります。ビューモデルはオブジェクトやリストをプロパティとして公開し、コマンドのようなものも公開します。コマンドは、単に動作(最も単純には、メソッド呼び出し)であり、それを持ち歩くオブジェクトに包まれます。ビューは、オブジェクトに視覚的なコントロールをアタッチするデータバインディングによって駆動されるので、この考えは重要です。MVVM では、ボタンにクリック ハンドラ メソッドを与えるのではなく、クリックしたときに実行したい機能を含むコマンド オブジェクト (ビューモデルのプロパティから提供される) にボタンをバインドします。
私にとっては、最も混乱した部分は次のようなものでした。
- ビューモデルはグラフィカルなアプリケーションのモデルであるにもかかわらず、視覚的な概念を直接参照したり使用したりすることはありません。たとえば、ViewModels 内で Windows コントロールを参照することはありません - これらはビューで行います。ViewModelsは、コントロールや他のオブジェクトにバインドするためのデータや動作を公開するだけです。例えば、ListBox を含むビューをお持ちですか?ビューモデルには、ほぼ間違いなく何らかのコレクションが含まれるでしょう。ビューにはボタンがありますか?あなたのビューモデルはほぼ間違いなく何らかのコマンドを持っていることでしょう。
- ビューモデルとみなされるオブジェクトにはいくつかの種類があります。最も単純なビューモデルは、コントロールやスクリーンを 1:1 の関係で直接表すもので、例えば、quot; スクリーン XYZ にはテキストボックス、リストボックス、3 つのボタンがあり、ビューモデルには文字列、コレクション、3 つのコマンドが必要です。 ビューモデル層に適した別の種類のオブジェクトは、モデルオブジェクトに動作を与え、ビューでより使用しやすくするラッパーです。ビューモデル層は、モデルオブジェクトを直接ビューに公開するビューモデルのセットで、ビューがモデルオブジェクトのプロパティに直接バインドされることを意味します。これは単純な読み取り専用のビューのようなものには有効ですが、各オブジェクトに関連する動作を持たせたい場合はどうでしょうか?モデルはアプリケーションとは関係なく、あなたのドメインにのみ関係するからです。モデルオブジェクトをラップして、よりバインディングに適したデータと振る舞いを提供するオブジェクトにそれを置くことができます。このラッパーオブジェクトはビューモデルとも呼ばれ、ビューモデル層が厚くなり、ビューがモデルクラスの何かに直接バインドされることがなくなります。コレクションは、モデルそのものを含むのではなく、モデルをラップするビューモデルを含みます。
MVVM を動作させるための ValueConverters のような理解すべきイディオムがたくさんあり、Blendability、テスト、アプリ内でデータを渡す方法、各ビューモデルが必要な動作に確実にアクセスする方法 (ここで依存性注入が登場します) などについて考え始めると、適用すべきことがたくさんありますが、上記が良いスタートとなることを願っています。重要なのは、ビジュアル、ドメイン、および実際のアプリケーションの構造と動作を、3 つの異なるものとして考えることです。
関連
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
ハートビート・エフェクトのためのHTML+CSS
-
HTML ホテル フォームによるフィルタリング
-
HTML+cssのボックスモデル例(円、半円など)「border-radius」使いやすい
-
HTMLテーブルのテーブル分割とマージ(colspan, rowspan)
-
ランダム・ネームドロッパーを実装するためのhtmlサンプルコード
-
Html階層型ボックスシャドウ効果サンプルコード
-
QQの一時的なダイアログボックスをポップアップし、友人を追加せずにオンラインで話す効果を達成する方法
-
sublime / vscodeショートカットHTMLコード生成の実装
-
HTMLページを縮小した後にスクロールバーを表示するサンプルコード
-
html のリストボックス、テキストフィールド、ファイルフィールドのコード例