Vue 源码知识点

作者: Ricoywang | 来源:发表于2019-08-16 16:30 被阅读0次

    记录源码中的知识点

    • 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算法前置知识点,newvdomoldvdom进行比较时并不改变两个vdom而是直接作用于与真实dom上,比较的过程其实可以看做两个问题,1、newvdom里的新增节点如何插入到对应位置的真实dom上。2、如何在真实dom上移除oldvdom旧的节点。
    • 10、组件插槽是在父组件的作用域内进行编译成render函数后,在子组件进行使用,描述可能不准确,需要再确认
    • 11、v-bind方法如何做到将父组件的属性挂到子组件上的:
    • 12、在vue中使用extends继承Array ,对象原型会被直接重写覆盖,new Observer -> protoAugment

    相关文章

      网友评论

        本文标题:Vue 源码知识点

        本文链接:https://www.haomeiwen.com/subject/zwlqsctx.html