imisou / vue-reading

Vue源码阅读

Vue源码学习记录

介绍

Vue.js源码的分析过程，详细记录了Vue源码阅读过程中的所有的心得和收获，通过阅读的过程大大加深对Vue的理解。

---

核心

• Vue 的合并策略

• Vue 双向绑定的实现

• Vue 生命周期

• Vue 组件树生成过程

• Vue 初始化过程

• Vue Diff过程

• Vue 的钩子函数

• Vue 的编译过程

目录

src : 源码相关(内部附带个人阅读笔记)

doc : 阅读期间的总结笔记

1. 组件部分

   1. functional 函数式组件

      ☐ 文档编写

   2. slot 插槽

      ✔ 文档编写 @done (9/26/2018, 3:06:39 PM)

      ☐ 插槽作用域（更新流程）

2. 属性描述符

   1. prop

      ✔ 基本文档完成 @done (9/27/2018, 3:56:55 PM)

      ☐ 详解prop描述符的 textContent 与 value在dom-props.js中的处理方式

3. 指令部分

   0. 指令流程

      ✔ 源码分析 @done (9/27/2018, 9:10:08 PM)

      ✔ 文档编写 @done (9/27/2018, 9:10:12 PM)

   1. v-text

      ✔ 文档 @done (9/27/2018, 3:57:46 PM)

   2. v-html

      ✔ 源码分析 @done (9/27/2018, 9:10:19 PM)

      ✔ 文档编写 @done (9/27/2018, 9:10:20 PM)

   3. v-show

      ☐ 源码分析

      ☐ 文档编写

      ☐ v-show 与 transition 结合使用

   4. v-if、v-else-if、v-else

      ☐ 源码分析

      ☐ 文档编写

   5. v-for

      ☐ 源码分析

      ☐ 文档编写

   6. v-bind

      ☐ 源码分析

      ☐ 文档编写

   7. v-model

      ☐ 源码分析

      ☐ 文档编写

   8. v-pre

      ✔ 源码分析 @done (9/27/2018, 9:10:50 PM)

      ✔ 文档编写 @done (9/27/2018, 9:10:52 PM)

   9. v-cloak

      ☐ 源码分析

      ☐ 文档编写

   10. v-once

       ✔ 源码分析 @done (9/27/2018, 9:10:55 PM)

       ✔ 文档编写 @done (9/27/2018, 9:10:56 PM)

4. 过滤器

   • 源码分析

     • 属性中parseFilter

     • 文本中parseFilter

     • _f()

   • 文档编写

5. 事件

   1. 编译阶段 
   
     - parse阶段
   
     - generate阶段
   
   2. 运行阶段
   
    - 元素DOM事件
   
    - 组件DOM事件
   
    - 组件自定义事件
   

example : 阅读过程中使用的一些示例

感谢尤大提高生产力。