记录源码中的知识点
1,vue 加载数据状态先后顺序:
props->data->computed->watch
2, 收集依赖是 defineReactive 中的 get 触发更新是函数中的 set
3, 一个组件一般固定一个 watcher, 存有组件的 update(render) 更新函数, 除了固定函数外还有 normal-watcher computed-watcher 两种.
4,Vue data 每个对象包括子对象都拥有一个 Dep 的实例对象, dep 对象只有 id subs 两个属性. 主要是在
dep.notify->forEach(watcher.update)->watcher.run-> expression
5,props 在传入子组件后属性再次被 defineReactive 加入当前组件 watcher 依赖, 并赋予又一个 dep, 同时同一属性的
Object.defineProperty
将会被覆盖.
- 6,complite -> $mounted ->
- mountComponent (_update(_render())new Watcher)
,_render 生成 vdom,
_update =: vm.__patch__(vm.$el, vnode)
根据 vdom 插入 dom 树.
7, 在
src/core/vdom/path.JS
文件中的 createElm 函数执过程中会遍历 children 如果为组件则创建组件, 最终递归创建 append 元素,
createElm
8,Vue dom 树是自下而上进行穿件插入, vdom 则是自上而下是组件实例化的过程. 疑问, 在整棵 dom 树还没插入到根节点 el 上时, 为什么在生命钩子函数 mounted 时能获取对应的 dom 对象. 解答: mounted 和其他钩子函数不一样, 触发时机是已订阅的方式
9,diff 算法前置知识点, newvdom 与 oldvdom 进行比较时并不改变两个 vdom 而是直接作用于与真实 dom 上, 比较的过程其实可以看做两个问题, 1,newvdom 里的新增节点如何插入到对应位置的真实 dom 上. 2, 如何在真实 dom 上移除 oldvdom 旧的节点.
10, 组件插槽是在父组件的作用域内进行编译成 render 函数后, 在子组件进行使用,
描述可能不准确, 需要再确认
11,v-bind 方法如何做到将父组件的属性挂到子组件上的:
12, 在 vue 中使用 extends 继承 Array , 对象原型会被直接重写覆盖,
new Observer -> protoAugment
来源: http://www.jianshu.com/p/b3e7305e4e60