Skip to content

Latest commit

 

History

History
48 lines (42 loc) · 4.71 KB

03.md

File metadata and controls

48 lines (42 loc) · 4.71 KB

解析模板

  1. start 钩子函数是当解析 html 字符串遇到开始标签时被调用的。
  2. 模板中禁止使用 <style> 标签和那些没有指定 type 属性或 type 属性值为 text/javascript 的 <script> 标签。
  3. 在 start 钩子函数中会调用前置处理函数,这些前置处理函数都放在 preTransforms 数组中,这么做的目的是为不同平台提供对应平台下的解析工作。
  4. 前置处理函数执行完之后会调用一系列 process* 函数继续对元素描述对象进行加工。
  5. 通过判断 root 是否存在来判断当前解析的元素是否为根元素。
  6. slot 标签和 template 标签不能作为根元素,并且根元素不能使用 v-for 指令。
  7. 可以定义多个根元素,但必须使用 v-if、v-else-if 以及 v-else 保证有且仅有一个根元素被渲染。
  8. 构建 AST 并建立父子级关系是在 start 钩子函数中完成的,每当遇到非一元标签,会把它存到 currentParent 变量中,当解析该标签的子节点时通过访问 currentParent 变量获取父级元素。
  9. 如果一个元素使用了 v-else-if 或 v-else 指令,则该元素不会作为子节点,而是会被添加到相符的使用了 v-if 指令的元素描述对象的 ifConditions 数组中。
  10. 如果一个元素使用了 slot-scope 特性,则该元素也不会作为子节点,它会被添加到父级元素描述对象的 scopedSlots 属性中。
  11. 对于没有使用条件指令或 slot-scope 特性的元素,会正常建立父子级关系。

v-for指令

  1. 如果 v-for 指令的值为 'obj in list',则 alias 的值为字符串 'obj'
  2. 如果 v-for 指令的值为 '(obj, index) in list',则 alias 的值为字符串 'obj, index'
  3. 如果 v-for 指令的值为 '(obj, key, index) in list',则 alias 的值为字符串 'obj, key, index'
  4. 如果 alias 字符串的值为 'obj',则匹配结果 iteratorMatch 常量的值为 null
  5. 如果 alias 字符串的值为 'obj, index',则匹配结果 iteratorMatch 常量的值是一个包含两个元素的数组:[', index', 'index']
  6. 如果 alias 字符串的值为 'obj, key, index',则匹配结果 iteratorMatch 常量的值是一个包含三个元素的数组:[', key, index', 'key', 'index']

v-if指令

  1. 如果标签使用了 v-if 指令,则该标签的元素描述对象的 el.if 属性存储着 v-if 指令的属性值
  2. 如果标签使用了 v-else 指令,则该标签的元素描述对象的 el.else 属性值为 true
  3. 如果标签使用了 v-else-if 指令,则该标签的元素描述对象的 el.elseif 属性存储着 v-else-if 指令的属性值
  4. 如果标签使用了 v-if 指令,则该标签的元素描述对象的 ifConditions 数组中包含“自己”
  5. 如果标签使用了 v-else 或 v-else-if 指令,则该标签的元素描述对象会被添加到与之相符的带有 v-if 指令的元素描述对象的 ifConditions 数组中。

判断管道符

  1. 不在 '' "" `` // 中
  2. 当前字符所对应的 ASCII 码必须是 0x7C,即当前字符必须是管道符。
  3. 该字符的后一个字符不能是管道符。
  4. 该字符的前一个字符不能是管道符。
  5. 该字符不能处于花括号、方括号、圆括号之内

判断ref属性

  1. 该标签的元素描述对象会被添加 el.ref 属性,该属性为解析后生成的表达式字符串,与 el.key 类似。
  2. 该标签的元素描述对象会被添加 el.refInFor 属性,它是一个布尔值,用来标识当前元素的 ref 属性是否在 v-for 指令之内使用。

解析 slot

  1. 对于 标签,会为其元素描述对象添加 el.slotName 属性,属性值为该标签 name 属性的值,并且 name 属性可以是绑定的。
  2. 对于 标签,会优先获取并使用该标签 scope 属性的值,如果获取不到则会获取 slot-scope 属性的值,并将获取到的值赋值给元素描述对象的 el.slotScope 属性,注意 scope 属性和 slot-scope 属性不能是绑定的。
  3. 对于其他标签,会尝试获取 slot-scope 属性的值,并将获取到的值赋值给元素描述对象的 el.slotScope 属性。
  4. 对于非 标签,会尝试获取该标签的 slot 属性,并将获取到的值赋值给元素描述对象的 el.slotTarget 属性。如果一个标签使用了 slot 属性但却没有给定相应的值,则该标签元素描述对象的 el.slotTarget 属性值为字符串 '"default"'
  5. v-bind指令

    1. 任何绑定的属性,最终要么会被添加到元素描述对象的 el.attrs 数组中,要么就被添加到元素描述对象的 el.props 数组中。
    2. 对于使用了 .sync 修饰符的绑定属性,还会在元素描述对象的 el.events 对象中添加名字为 'update:${驼峰化的属性名}' 的事件