想必喜欢前端开发的小伙伴们都或多或少接触过MVVM这个概念，说起MVVM，第一时间想到的便是angularjs，knockoutjs等已经被广泛运用的MVVM框架，之前我也没有在这方面有很多了解，最近在做项目的过程中接触了Vue.js,这是一个小巧精致，性能优异的MVVM框架，可以说对初学者是比较容易入门的，该框架的英文文档写得很好，但是中文版访问还不太稳定，翻译也有待改进，所以自己一遍学习，一遍记录自己的思考，与各位共享学习的经验。
第一篇主要是想谈谈vue.js中的Directives即指令，在vue.js中指令就是一个通知库进行某些具体的dom操作的口令，在html中表现为如下形式：
<element
prefix-directiveId="[argument:] expression [| filters...]">
</element>
Directives分为1.Reactive Directives、2.Literal Directives、3.Empty Directives，下面结合具体的api阐述他们的作用：
1.Reactive Directives（响应式指令）
Reactive Directives可以绑定在Vue实例或者在Vue实例上下文中求值的表达式上，当绑定的对象发生改变时，指令中的update()会在下一个系统单位时间发生异步响应，我们来看看具体的用法：
v-text:更新元素的textContent，事实上在html中{{mustache}}形式的插入值也会被编译为针对一个textNode的v-text指令。
v-html:更新元素的innerHTML，由于可能插入恶意代码，使用时要注意保证来源安全。
v-show:根据绑定值的true或false来决定所在元素在网页中正常显示还是显示为空。
v-class：这个指令有一个可选参数，无参数时将绑定值（一般为class名）添加到所在元素的classlist当中，并且一旦检测绑定值有改动，便随之改变classlist里对应的class；提供参数时参数的true或false将决定绑定值（class）是否被添加到所在元素的classlist中，示例如下：
<span v-class="
red : hasError,
bold : isImportant,
hidden : isHidden
"></span>
v-attr:更新所在元素的某些属性（由参数表示）。
<canvas v-attr="width:w, height:h"></canvas>v-style:更新所在元素的样式，会智能添加浏览器供应商前缀，方便我们书写样式。这个指令有一个可选参数，无参数时，若绑定值为String则将绑定值设置为元素的style.cssText，若绑定值为Object则将Object中的样式键值对放入元素的style object当中；
<div v-style="myStyles"></div>
// myStyles can either be a String:
"color:red; font-weight:bold;"
