之前简单分析了前三次提交,实现了 v-on v-show v-text 等功能的响应式
然后我们切到第四次提交
可以看到,不应该写入过滤器值是本次提交信息
那么在这次提交中具体修改了什么东东呢
main.js
首先在 self 字段上新加了属性 _bindings 字段 ,和 var bindings 的指向相同
然后在 Seed 原型上添加了两个方法 dump destroy 丢弃和销毁方法
学英语
dump 函数内部,如果 this._bindings[key].value 全是基本数据类型,这个函数相当于实现了一个深拷贝,具体作用未知
destroy 函数,可以看到是遍历 this._bindings 去执行了所有的 directive 中定义的 unbind 函数,然后移除父节点下所有的子节点(自身节点??)
然后把 directive.el = el 上移,作用未知
上图就是 commit log 中的信息了,可以看到,yyx 写了一个明显的 bug,在渲染完页面后,如果使用过滤器,原始值会被改变,破坏了设计初衷,原因是什么呢,请看
可以看到,两个 p 标签绑定的都是 msg 变量,然后 vue 解析指令的时候
其中的第一次遍历
图中标红的框会通过,然后在第二个 msg 绑定执行的时候,因为 forEach 在 set 函数的作用域内,因此,value 的值会变成 filter 之后的值,也就是首字母大写的 Hello,解决办法就是在 forEach 的每次迭代,使用临时变量保存 value 值
directives.js
添加了 repeat 指令,估计要实现现在我们所熟知的 v-for 功能
本文使用 文章同步助手 同步