共计 1840 个字符,预计需要花费 5 分钟才能阅读完成。
mountHooks 和 updateHooks 执行根本一样,多了 deps 判断
mountWorkInProgressHook: 执行函数组件时 —— Component(props, secondArg),hooks 执行;挂载到 fiber.memoizedState 下
function mountWorkInProgressHook() {
var hook = {
memoizedState: null,
baseState: null,
baseQueue: null,
queue: null,
next: null,
};
if (workInProgressHook === null) {currentlyRenderingFiber$1.memoizedState = workInProgressHook = hook;} else {workInProgressHook = workInProgressHook.next = hook;}
return workInProgressHook;
}
useEffect
mountEffectImpl
function mountEffectImpl(fiberFlags: number, hookFlags: number, create, deps) {var hook = mountWorkInProgressHook();
var nextDeps = deps === undefined ? null : deps;
currentlyRenderingFiber$1.flags |= fiberFlags;
hook.memoizedState = pushEffect(
HasEffect | hookFlags,
create,
undefined,
nextDeps
);
}
pushEffect: updateQueue 放入要更新到 effect
function pushEffect(tag, create, destroy, deps) {
var effect = {
tag: tag,
create: create,
destroy: destroy,
deps: deps,
next: null,
};
var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue;
if (componentUpdateQueue === null) {componentUpdateQueue = createFunctionComponentUpdateQueue();
currentlyRenderingFiber$1.updateQueue = componentUpdateQueue;
componentUpdateQueue.lastEffect = effect.next = effect;
} else {
var lastEffect = componentUpdateQueue.lastEffect;
if (lastEffect === null) {componentUpdateQueue.lastEffect = effect.next = effect;} else {
var firstEffect = lastEffect.next;
lastEffect.next = effect;
effect.next = firstEffect;
componentUpdateQueue.lastEffect = effect;
}
}
return effect;
}
useState
mountState
function mountState(initialState) {var hook = mountWorkInProgressHook();
// 是办法,先执行失去 初始值
if (typeof initialState === "function") {initialState = initialState();
}
hook.memoizedState = hook.baseState = initialState;
var queue = (hook.queue = {
pending: null,
dispatch: null,
lastRenderedReducer: basicStateReducer,
lastRenderedState: initialState,
});
var dispatch = (queue.dispatch = dispatchAction.bind(
null,
currentlyRenderingFiber$1,
queue
));
return [hook.memoizedState, dispatch];
}
正文完