vue源码分析（2）

记录之。。。

• 模板解析(1)：大括号表达式解析

1. 根据正则对象得到匹配出的表达式字符串：子匹配/RegExp.$1 name
2. 从data中取出表达式对应的属性值
3. 把属性值设置为文本节点的textContent

• 模板解析(2)：事件指令解析（compile）

1. 从指令中取出事件名。
2. 根据指令的值（表达式）从methods中得到相应的事件处理函数对象。
3. 给当前元素节点绑定指定事件名和回调函数（强制绑定this指向vm）的dom事件监听。

 //判断是否是事件指令
if(me.isEventDirective(dir)){
 //node:节点   me.$vm:vm    exp:表达式(事件方法)   dir: 指令名(on:click)
  compileUtil.eventHandler(node,me.$vm,exp,dir);        //解析处理事件指令
  }

4. 指令解析完后，移除此指令属性。

• 模板解析(3)：一般指令解析

1. 得到指令名和指令值（表达式）。 text/html/class
2. 从data中根据表达式得到对应的值。
3. 根据指令名确定需要操作元素节点的什么属性。
   v-text：textContent属性
   v-html：innerHTML属性
   v-class：className属性
4. 将得到的表达式的值设置到对应的属性上。
5. 移除元素的指令属性。