1.NuGet引用MVVM框架包

引入該框架包之后, 默認會在目錄下創建ViewModel層的示例代碼

2.第二步, 通過在MainViewModel中創建一些業務代碼, 將其與MainWindow.xaml 通過上下文的方式關聯起來, 而MainWindow則是通過Binding的寫法 引用業務邏輯的部分。

在MainViewModel中, 添加同一個班級名稱, 與學生列表, 分別用于顯示在文本 和列表上展示, Command則用于綁定DataGrid的雙擊命令上, 通過雙擊, 展示點擊行的學生信息:

MainViewModel 繼承了 ViewModelBase, 該繼承的父類實在MVVM框架中, 實現雙向通知的基類, 通過引用該類, 那么其之類的屬性則可通過 添加 RaisePropertyChanged() 即可。

- 為MainViewModel添加一些模擬數據

? - ?設計UI層, 添加一個文本用于顯示班級名稱, ?添加一個DataGrid 用于展示學生列表, ?同時DataGrid中添加一個綁定的命令(紅色區域)

關于上面紅色圈的代碼, 為一種綁定語法, 主要在MouseBinding中, MouseAction 以為觸發的事件類型, CommandParameter 則是命令傳遞的參數, 也就是DataGrid選中的一行的類型 Student。

Command 則是MainViewModel中定義的Command

- 現在, 前端的綁定工作已經設置好, 后臺的代碼也添加完成, 目前只需要將MainViewModel 與MainWindow 通過MainWindow的DataContext關聯即可

運行效果如下:

RaisePropertyChanged() 實現動態通知更新

+ 通過set訪問器更新ClassName的同時, 調用RaisePropertyChanged 方法, 界面刷新更新后的值

+ 添加一個無參數的UpdateCommand , 并設置為 UpdateText 手動把ClassName更新為 "高三三班":

+ UI層添加一個簡單按鈕, 綁定后臺的UpdateCommand命令

運行測試效果:

本章測試代碼下載