MCPcopy
hub / github.com/ygs-code/vue / createElm

Function createElm

vue.js:8063–8168  ·  view source on GitHub ↗
(
            vnode,  //vnode 节点,
            insertedVnodeQueue, //插入Vnode队列
            parentElm, //父亲节点
            refElm,  //当前的节点的兄弟节点
            nested,  //嵌套
            ownerArray, //主数组 节点
            index  //索引
        )

Source from the content-addressed store, hash-verified

8061 var creatingElmInVPre = 0;
8062 //创建dom 节点
8063 function createElm(
8064 vnode, //vnode 节点,
8065 insertedVnodeQueue, //插入Vnode队列
8066 parentElm, //父亲节点
8067 refElm, //当前的节点的兄弟节点
8068 nested, //嵌套
8069 ownerArray, //主数组 节点
8070 index //索引
8071 ) {
8072 console.log(vnode)
8073 //判断是否定义有vnode.elm 和 定义有ownerArray
8074 if (isDef(vnode.elm) && isDef(ownerArray)) {
8075 // This vnode was used in a previous render!
8076 // now it's used as a new node, overwriting its elm would cause
8077 // potential patch errors down the road when it's used as an insertion
8078 // reference node. Instead, we clone the node on-demand before creating
8079 // associated DOM element for it.
8080 //这个vnode在之前的渲染中使用过!
8081 //现在它被用作一个新节点,覆盖它的elm将导致
8082 //当它被用作插入时,将来可能会出现补丁错误
8083 //引用节点。相反,我们在创建之前按需克隆节点
8084 //关联的DOM元素。
8085 //克隆一个新的节点
8086
8087 vnode = ownerArray[index] = cloneVNode(vnode);
8088 }
8089
8090 vnode.isRootInsert = !nested; // for transition enter check //对于过渡输入检查
8091 //创建组件,并且判断它是否实例化过
8092 if (createComponent(
8093 vnode, //虚拟dom vonde
8094 insertedVnodeQueue, //插入Vnode队列
8095 parentElm,//父亲节点
8096 refElm //当前节点
8097 )) {
8098 return
8099 }
8100
8101 var data = vnode.data; //vnode 数据 如 属性等
8102 var children = vnode.children; //vonde 子节点
8103 var tag = vnode.tag; //vonde 标签
8104
8105
8106 if (isDef(tag)) { //如果组件标签定义了
8107 console.log(vnode)
8108
8109 {
8110
8111 if (data && data.pre) { //标记是否是pre 标签吧
8112 creatingElmInVPre++;
8113 }
8114 // 检查dom 节点的tag标签 类型 是否是VPre 标签 或者是判断是否是浏览器自带原有的标签
8115 if (isUnknownElement$$1(vnode, creatingElmInVPre)) {
8116 warn(
8117 'Unknown custom element: <' + tag + '> - did you ' +
8118 'register the component correctly? For recursive components, ' +
8119 'make sure to provide the "name" option.',
8120 vnode.context

Callers 4

createChildrenFunction · 0.85
addVnodesFunction · 0.85
updateChildrenFunction · 0.85
createPatchFunctionFunction · 0.85

Calls 9

isDefFunction · 0.85
cloneVNodeFunction · 0.85
createComponentFunction · 0.85
isUnknownElement$$1Function · 0.85
setScopeFunction · 0.85
createChildrenFunction · 0.85
invokeCreateHooksFunction · 0.85
insertFunction · 0.85
isTrueFunction · 0.85

Tested by

no test coverage detected