normalizeChildren 与 createChildren 函数之间的关联

Question

在 render 阶段 进入 normalizeChildren 函数的时候 是将 children 整理成 vnode[]
也既是 function normalizeChildren (children: any): ?Array<VNode>

在 update 阶段当 传入的 vnode 定义了 tag，那么 将会 进入
createChildren(vnode, children, insertedVnodeQueue); 这个函数，也就是 对 children 进行整理。 在 createChildren 函数中 有 个 判断条件

function createChildren(vnode, children, insertedVnodeQueue) {
	// children 不应该 一直都是一个数组么，什么条件 会进入 else if 语句
    if (Array.isArray(children)) {
        for (let i = 0; i < children.length; ++i) {
            createElm(children[i], insertedVnodeQueue, vnode.elm, null, true, children, i);
        }
    } else if (isPrimitive(vnode.text)) {
        nodeOps.appendChild(vnode.elm, nodeOps.createTextNode(String(vnode.text)));
    }
}

由于 normalizeChildren 函数 一直 都是 返回一个 数组的，那么 什么条件情况下 createChildren 会进入 isPrimitive(vnode.text) 这个 条件里面

Answer 1

ustbhuangyi 2020-01-01 00:07:58

createChildren 函数中的 children 还可能是 undefined，考虑到 createElm 函数就是递归执行 createChildren，vnode.chiddren 可能是 undefined ，就走到了 else if 逻辑了

• 提问者 aznmoe #1

  非常感谢！

• 月上云流 #2

  老师，_render中的createElement方法不是已经将vnode的children拍平成一维数组了么，为什么在update的createElm里还需要递归执行createChildren?

• 月上云流 #3

  我明白了老师?，看了编译后的render函数我才知道每一层dom节点都会调用一次$createElement

点开查看后面1条评论