共计 2575 个字符,预计需要花费 7 分钟才能阅读完成。
reconcileChildren
params
- current
- workInProgress
-
nextChildren
- class 组件: instance.render()
- 函数组件: return 的值
- renderLanes
function reconcileChildren(current, workInProgress, nextChildren, renderLanes) {if (current === null) {
workInProgress.child = mountChildFibers(
workInProgress,
null,
nextChildren,
renderLanes
);
} else {
workInProgress.child = reconcileChildFibers(
workInProgress,
current.child,
nextChildren,
renderLanes
);
}
}
reconcileChildFibers
params
- returnFiber
- currentFirstChild
-
newChild
- class 组件: instance.render()
- 函数组件: return 的值
- lanes
function reconcileChildFibers(returnFiber, currentFirstChild, newChild, lanes) {
var isUnkeyedTopLevelFragment =
typeof newChild === "object" &&
newChild !== null &&
newChild.type === REACT_FRAGMENT_TYPE &&
newChild.key === null;
if (isUnkeyedTopLevelFragment) {newChild = newChild.props.children;}
var isObject = typeof newChild === "object" && newChild !== null;
if (isObject) {switch (newChild.$$typeof) {
// reconcileSingleElement
case REACT_ELEMENT_TYPE:
return placeSingleChild(
reconcileSingleElement(
returnFiber,
currentFirstChild,
newChild,
lanes
)
);
case REACT_PORTAL_TYPE:
return placeSingleChild(reconcileSinglePortal(returnFiber, currentFirstChild, newChild, lanes)
);
}
}
if (typeof newChild === "string" || typeof newChild === "number") {
return placeSingleChild(
reconcileSingleTextNode(
returnFiber,
currentFirstChild,
"" + newChild,
lanes
)
);
}
// 数组时
if (isArray$1(newChild)) {
return reconcileChildrenArray(
returnFiber,
currentFirstChild,
newChild,
lanes
);
}
if (getIteratorFn(newChild)) {
return reconcileChildrenIterator(
returnFiber,
currentFirstChild,
newChild,
lanes
);
}
if (isObject) {throwOnInvalidObjectType(returnFiber, newChild);
}
{if (typeof newChild === "function") {warnOnFunctionType(returnFiber);
}
}
if (typeof newChild === "undefined" && !isUnkeyedTopLevelFragment) {switch (returnFiber.tag) {
case ClassComponent: {
{
var instance = returnFiber.stateNode;
if (instance.render._isMockFunction) {break;}
}
}
case Block:
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
{
{
throw Error((getComponentName(returnFiber.type) || "Component") +
"(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null."
);
}
}
}
}
}
return deleteRemainingChildren(returnFiber, currentFirstChild);
}
createFiberFromElement
params
- element: ReactElement 对象
- mode
- lanes
性能
-
执行 createFiberFromTypeAndProps,创立 Fiber
- 创立 createFiber: fiber.elementType = type;
代码
function createFiberFromElement(element, mode, lanes) {
var owner = null;
{owner = element._owner;}
var type = element.type;
var key = element.key;
var pendingProps = element.props;
var fiber = createFiberFromTypeAndProps(
type,
key,
pendingProps, // element.props
owner,
mode,
lanes
);
{
fiber._debugSource = element._source;
fiber._debugOwner = element._owner;
}
return fiber;
}
正文完