normalize-children.ts — vue Source File
Architecture documentation for normalize-children.ts, a typescript file in the vue codebase. 2 imports, 1 dependents.
Entity Profile
Dependency Diagram
graph LR 6a6aa84d_7f9a_89f4_4499_eb3dd1af08a8["normalize-children.ts"] 973389ac_8625_30a3_53ce_b1b48fae58c5["vnode"] 6a6aa84d_7f9a_89f4_4499_eb3dd1af08a8 --> 973389ac_8625_30a3_53ce_b1b48fae58c5 09aa5370_2caa_6b33_3f44_6ac5211bd11b["util"] 6a6aa84d_7f9a_89f4_4499_eb3dd1af08a8 --> 09aa5370_2caa_6b33_3f44_6ac5211bd11b 414b37af_5f63_dee7_31a2_9a7cad5979ec["create-functional-component.ts"] 414b37af_5f63_dee7_31a2_9a7cad5979ec --> 6a6aa84d_7f9a_89f4_4499_eb3dd1af08a8 style 6a6aa84d_7f9a_89f4_4499_eb3dd1af08a8 fill:#6366f1,stroke:#818cf8,color:#fff
Relationship Graph
Source Code
import VNode, { createTextVNode } from 'core/vdom/vnode'
import {
isFalse,
isTrue,
isArray,
isDef,
isUndef,
isPrimitive
} from 'shared/util'
// The template compiler attempts to minimize the need for normalization by
// statically analyzing the template at compile time.
//
// For plain HTML markup, normalization can be completely skipped because the
// generated render function is guaranteed to return Array<VNode>. There are
// two cases where extra normalization is needed:
// 1. When the children contains components - because a functional component
// may return an Array instead of a single root. In this case, just a simple
// normalization is needed - if any child is an Array, we flatten the whole
// thing with Array.prototype.concat. It is guaranteed to be only 1-level deep
// because functional components already normalize their own children.
export function simpleNormalizeChildren(children: any) {
for (let i = 0; i < children.length; i++) {
if (isArray(children[i])) {
return Array.prototype.concat.apply([], children)
}
}
return children
}
// 2. When the children contains constructs that always generated nested Arrays,
// e.g. <template>, <slot>, v-for, or when the children is provided by user
// with hand-written render functions / JSX. In such cases a full normalization
// is needed to cater to all possible types of children values.
export function normalizeChildren(children: any): Array<VNode> | undefined {
return isPrimitive(children)
? [createTextVNode(children)]
: isArray(children)
? normalizeArrayChildren(children)
: undefined
}
function isTextNode(node): boolean {
return isDef(node) && isDef(node.text) && isFalse(node.isComment)
}
function normalizeArrayChildren(
children: any,
nestedIndex?: string
): Array<VNode> {
const res: VNode[] = []
let i, c, lastIndex, last
for (i = 0; i < children.length; i++) {
c = children[i]
if (isUndef(c) || typeof c === 'boolean') continue
lastIndex = res.length - 1
last = res[lastIndex]
// nested
if (isArray(c)) {
if (c.length > 0) {
c = normalizeArrayChildren(c, `${nestedIndex || ''}_${i}`)
// merge adjacent text nodes
if (isTextNode(c[0]) && isTextNode(last)) {
res[lastIndex] = createTextVNode(last.text + c[0].text)
c.shift()
}
res.push.apply(res, c)
}
} else if (isPrimitive(c)) {
if (isTextNode(last)) {
// merge adjacent text nodes
// this is necessary for SSR hydration because text nodes are
// essentially merged when rendered to HTML strings
res[lastIndex] = createTextVNode(last.text + c)
} else if (c !== '') {
// convert primitive to vnode
res.push(createTextVNode(c))
}
} else {
if (isTextNode(c) && isTextNode(last)) {
// merge adjacent text nodes
res[lastIndex] = createTextVNode(last.text + c.text)
} else {
// default key for nested array children (likely generated by v-for)
if (
isTrue(children._isVList) &&
isDef(c.tag) &&
isUndef(c.key) &&
isDef(nestedIndex)
) {
c.key = `__vlist${nestedIndex}_${i}__`
}
res.push(c)
}
}
}
return res
}
Domain
Subdomains
Dependencies
- util
- vnode
Imported By
Source
Frequently Asked Questions
What does normalize-children.ts do?
normalize-children.ts is a source file in the vue codebase, written in typescript. It belongs to the VueCore domain, GlobalAPI subdomain.
What functions are defined in normalize-children.ts?
normalize-children.ts defines 4 function(s): isTextNode, normalizeArrayChildren, normalizeChildren, simpleNormalizeChildren.
What does normalize-children.ts depend on?
normalize-children.ts imports 2 module(s): util, vnode.
What files import normalize-children.ts?
normalize-children.ts is imported by 1 file(s): create-functional-component.ts.
Where is normalize-children.ts in the architecture?
normalize-children.ts is located at src/core/vdom/helpers/normalize-children.ts (domain: VueCore, subdomain: GlobalAPI, directory: src/core/vdom/helpers).
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free