手记

【备战春招】第12天 6-20 什么是PatchFlag

课程章节:6-20 什么是PatchFlag

课程讲师: 双越

课程内容:

6-20 什么是PatchFlag

课程收获:

patchFlag 是在编译 template 模板时,给 vnode 添加的一个标识信息,这个标识信息反映了 vnode 的哪些部位绑定了动态值,这样在 runtime 阶段,可以根据 patchFlag 判断出哪些内容需要更新,实现靶向更新

export function h(type: any, propsOrChildren?: any, children?: any): VNode {
  if (arguments.length === 2) {
    if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
      // single vnode without props
      if (isVNode(propsOrChildren)) {
        return createVNode(type, null, [propsOrChildren]);
      }
      // props without children
      return createVNode(type, propsOrChildren);
    } else {
      // omit props
      return createVNode(type, null, propsOrChildren);
    }
  } else {
    if (isVNode(children)) {
      children = [children];
    }
    return createVNode(type, propsOrChildren, children);
  }
}

谢谢老师,讲的非常细致,很容易懂。这一节学的是什么是PatchFlag,为以后的学习打下了基础。
原来vue3能有这么多种性质,以及对vue3有了新的认识,期待后边的学习

0人推荐
随时随地看视频
慕课网APP