一、前言
上周简单介绍了AWTK-MVVM，并按照规则设计了图书管理系统的Model，详见文章：AWTK-MVVM学习（一）。本周学习了AWTK-MVVM的数据绑定和命令绑定，本文记录其中的关键内容，更详细的教程请参考awtk-mvvm/docs下的md文档。
awtk-mvvm仓库：http://github.com/zlgopen/awtk-mvvm
二、数据绑定
在进行数据绑定之前，先要建立 View（UI界面）与 ViewModel的联系。在AWTK 中用XML文件来描述用户界面，即View，在上周的博客中，设计了一个图书管理系统的Model，可根据注释生成 ViewModel 的代码，实现数据绑定的步骤如下：
（1）为界面绑定模型，即将 View 与 ViewModel 关联起来，在AWTK-MVVM中有一个 v-model 属性，该属性用来指定 ViewModel 的名称，将控件与模型绑定起来，通常我们在窗口上指定，XML如下：
<window v-model="book_controller">
...
</window>
(2)为控件绑定数据，即将某些控件的属性与 Model 中的指定属性（变量）绑定起来，这个绑定的具体操作由 ViewModel 完成，我们只需要在XML文件中指定属性即可，例如将 label 控件的文本（text属性）和 Model 中的书名（title属性）绑定，XML如下：
<window v-model="book_controller">
...
<label x="center" y="middle" w="50%" h="40" text="title" v-data:text="{item.title}"/>
...
</window>
其中 v-data:text="{item.title}" 的具体说明如下：
- v-data 表示该属性是一个数据绑定规则。
- text 表示控件的属性名称。
- item.title 表示Model中的属性，即变量名称，由于此处绑定的为复合数据，因此使用符号 "." 来表示。
备注：此处仅做最简单的示例，详细内容请参考awtk-mvvm/docs/data_binding.md
三、命令绑定
命令绑定与数据绑定类似，在AWTK-MVVM中同样通过在XML文件中添加属性完成。AWTK-MVVM中提供一个 v-on 属性，比如添加图书的指令为 “add” ，那么为按钮绑定该指令的XML如下：
<window v-model="book_controller">
...
<button name="btn_add" x="132" y="b:25%" w="100" h="36" v-on:click="{add}" text="Add"/>
...
</window>
其中 v-on:click="{add}" 的具体说明如下：
- v-on 表示该属性是一个命令绑定规则。
- click 表示绑定一个点击事件。
- add 表示绑定的命令为 add。
目前AWTK-MVVM提供的命令如下，后续还会持续更新：
| 命令 | 说明 |
|---|---|
| click | 点击事件 |
| pointer_down | 指针按下事件 |
| pointer_up | 指针松开事件 |
| key_down | 按键按下事件 |
| key_long_press | 按键长按事 |
| key_up | 按键松开事件 |
| global_key_down | 全局按键按下事件 |
| global_key_long_press | 全局按键长按事件 |
| global_key_up | 全局按键松开事件 |
| value_changed | 值改变事件 |
| value_changed_by_ui | 值（通过 UI 修改）改变事件 |
备注：此处仅做最简单的示例，详细内容请参考awtk-mvvm/docs/command_binding.md
来源：oschina
链接：https://my.oschina.net/u/4708688/blog/4874428