Match-id-2a7374e4246145afb0681f473ee89cd06e492eb7

This commit is contained in:
* 2022-03-28 20:10:21 +08:00 committed by *
parent a4f376b84b
commit 867cb48365
9 changed files with 16 additions and 216 deletions

View File

@ -3,11 +3,11 @@
* begin阶段会修改一些全局的值complete阶段会恢复
*/
import type {VNode, ContextType} from './Types';
import type {Container} from '../dom/DOMOperator';
import type { VNode, ContextType } from './Types';
import type { Container } from '../dom/DOMOperator';
import {getNSCtx} from '../dom/DOMOperator';
import {ContextProvider} from './vnode/VNodeTags';
import { getNSCtx } from '../dom/DOMOperator';
import { ContextProvider } from './vnode/VNodeTags';
// 保存的是“http://www.w3.org/1999/xhtml”或“http://www.w3.org/2000/svg”
// 用于识别是使用document.createElement()还是使用document.createElementNS()创建DOM
@ -18,16 +18,8 @@ const CTX_CONTEXT = 'CTX_CONTEXT';
// 旧版context API,是否更改。
const CTX_OLD_CHANGE = 'CTX_OLD_CHANGE';
// 旧版context API保存的是的当前组件提供给子组件使用的context。
const CTX_OLD_CONTEXT = 'CTX_OLD_CONTEXT';
// 旧版context API保存的是的上一个提供者提供给后代组件使用的context。
const CTX_OLD_PREVIOUS_CONTEXT = 'CTX_OLD_PREVIOUS_CONTEXT';
let ctxNamespace: string = '';
let ctxOldContext: Object = {};
let ctxOldChange: Boolean = false;
let ctxOldPreviousContext: Object = {};
let ctxOldChange = false;
let ctxNamespace = '';
function setContext(vNode: VNode, contextName, value) {
if (vNode.contexts === null) {
@ -38,6 +30,7 @@ function setContext(vNode: VNode, contextName, value) {
vNode.contexts[contextName] = value;
}
}
function getContext(vNode: VNode, contextName) {
if (vNode.contexts !== null) {
return vNode.contexts[contextName];
@ -87,44 +80,6 @@ function recoverParentsContextCtx(vNode: VNode) {
}
}
// ctxOldContext是 旧context提供者的context
function setVNodeOldContext(providerVNode: VNode, context: Object) {
setContext(providerVNode, CTX_OLD_CONTEXT, context);
}
function getVNodeOldContext(vNode: VNode) {
return getContext(vNode, CTX_OLD_CONTEXT);
}
function setOldContextCtx(providerVNode: VNode, context: Object) {
setVNodeOldContext(providerVNode, context);
ctxOldContext = context;
}
function getOldContextCtx() {
return ctxOldContext;
}
function resetOldContextCtx(vNode: VNode) {
ctxOldContext = getVNodeOldContext(vNode);
}
function setVNodeOldPreviousContext(providerVNode: VNode, context: Object) {
setContext(providerVNode, CTX_OLD_PREVIOUS_CONTEXT, context);
}
function getVNodeOldPreviousContext(vNode: VNode) {
return getContext(vNode, CTX_OLD_PREVIOUS_CONTEXT);
}
function setOldPreviousContextCtx(context: Object) {
ctxOldPreviousContext = context;
}
function getOldPreviousContextCtx() {
return ctxOldPreviousContext;
}
function setContextChangeCtx(providerVNode: VNode, didChange: boolean) {
setContext(providerVNode, CTX_OLD_CHANGE, didChange);
ctxOldChange = didChange;
@ -145,18 +100,9 @@ export {
setContextCtx,
resetContextCtx,
recoverParentsContextCtx,
setOldContextCtx,
getOldContextCtx,
resetOldContextCtx,
setContextChangeCtx,
getContextChangeCtx,
resetContextChangeCtx,
setOldPreviousContextCtx,
getOldPreviousContextCtx,
setVNodeOldContext,
getVNodeOldContext,
setVNodeOldPreviousContext,
getVNodeOldPreviousContext,
};

View File

@ -1,101 +0,0 @@
import type {VNode} from '../../Types';
import {
setOldContextCtx,
setContextChangeCtx,
getOldContextCtx,
resetOldContextCtx,
resetContextChangeCtx,
setOldPreviousContextCtx,
getOldPreviousContextCtx,
setVNodeOldContext,
getVNodeOldContext,
setVNodeOldPreviousContext,
getVNodeOldPreviousContext,
} from '../../ContextSaver';
const emptyObject = {};
// 判断是否是过时的context的提供者
export function isOldProvider(comp: Function): boolean {
// @ts-ignore
const childContextTypes = comp.childContextTypes;
return childContextTypes !== null && childContextTypes !== undefined;
}
// 判断是否是过时的context的消费者
export function isOldConsumer(comp: Function): boolean {
// @ts-ignore
const contextTypes = comp.contextTypes;
return contextTypes !== null && contextTypes !== undefined;
}
// 如果是旧版context提供者则缓存两个全局变量上一个提供者提供的context和当前提供者提供的context
export function cacheOldCtx(processing: VNode, hasOldContext: any): void {
// 每一个context提供者都会更新ctxOldContext
if (hasOldContext) {
setOldPreviousContextCtx(getOldContextCtx());
const vNodeContext = getVNodeOldContext(processing) || emptyObject;
setOldContextCtx(processing, vNodeContext);
}
}
// 获取当前组件可以消费的context
export function getOldContext(processing: VNode, clazz: Function, ifProvider: boolean) {
const type = processing.type;
// 不是context消费者 则直接返回空对象
if (!isOldConsumer(type)) {
return emptyObject;
}
// 当组件既是提供者也是消费者时取上一个context不能直接取最新context因为已经被更新为当前组件的context
// 当组件只是消费者时则取最新context
const parentContext = (ifProvider && isOldProvider(clazz)) ?
getOldPreviousContextCtx() :
getOldContextCtx();
// 除非父级context更改否则不需要重新创建子context直接取对应节点上存的。
if (getVNodeOldPreviousContext(processing) === parentContext) {
return getVNodeOldContext(processing);
}
// 从父的context中取出子定义的context
const context = {};
for (const key in type.contextTypes) {
context[key] = parentContext[key];
}
// 缓存当前组件的context最近祖先传递下来context当前可消费的context
setVNodeOldPreviousContext(processing, parentContext);
setVNodeOldContext(processing, context);
return context;
}
// 重置context
export function resetOldCtx(vNode: VNode): void {
resetOldContextCtx(vNode);
resetContextChangeCtx(vNode);
}
// 当前组件是提供者则需要合并祖先context和当前组件提供的context
function handleContext(vNode: VNode, parentContext: Object): Object {
const instance = vNode.realNode;
if (typeof instance.getChildContext !== 'function') {
return parentContext;
}
// 合并祖先提供的context和当前组件提供的context
return {...parentContext, ...instance.getChildContext()};
}
// 当前组件是context提供者更新时需要合并祖先context和当前组件提供的context
export function updateOldContext(vNode: VNode): void {
const ctx = handleContext(vNode, getOldPreviousContextCtx());
// 更新context给子组件用的context
setOldContextCtx(vNode, ctx);
// 标记更改
setContextChangeCtx(vNode, true);
}

View File

@ -1,8 +1,6 @@
import type { VNode } from '../Types';
import {cacheOldCtx, isOldProvider} from '../components/context/CompatibleContext';
import {
ClassComponent,
ContextProvider,
DomComponent,
DomPortal,
@ -23,11 +21,6 @@ function handlerContext(processing: VNode) {
case DomComponent:
setNamespaceCtx(processing);
break;
case ClassComponent: {
const isOldCxtExist = isOldProvider(processing.type);
cacheOldCtx(processing, isOldCxtExist);
break;
}
case DomPortal:
setNamespaceCtx(processing, processing.realNode);
break;

View File

@ -2,13 +2,6 @@ import type { VNode } from '../Types';
import { mergeDefaultProps } from './LazyComponent';
import { getNewContext, resetDepContexts } from '../components/context/Context';
import {
cacheOldCtx,
getOldContext,
isOldProvider,
resetOldCtx,
updateOldContext,
} from '../components/context/CompatibleContext';
import {
callComponentWillMount,
callComponentWillReceiveProps,
@ -25,17 +18,18 @@ import { markRef } from './BaseComponent';
import {
processUpdates,
} from '../UpdateHandler';
import { getContextChangeCtx, setContextChangeCtx } from '../ContextSaver';
import { getContextChangeCtx } from '../ContextSaver';
import { setProcessingClassVNode } from '../GlobalVar';
import { onlyUpdateChildVNodes } from '../vnode/VNodeCreator';
import { createChildrenByDiff } from '../diff/nodeDiffComparator';
const emptyContextObj = {};
// 获取当前节点的context
export function getCurrentContext(clazz, processing: VNode) {
const context = clazz.contextType;
return typeof context === 'object' && context !== null
? getNewContext(processing, context)
: getOldContext(processing, clazz, true);
: emptyContextObj;
}
// 挂载实例
@ -112,8 +106,6 @@ export function captureRender(processing: VNode): VNode | null {
clazz = clazz._load(clazz._content);
}
}
const isOldCxtExist = isOldProvider(clazz);
cacheOldCtx(processing, isOldCxtExist);
resetDepContexts(processing);
@ -170,24 +162,13 @@ export function captureRender(processing: VNode): VNode | null {
// 不复用
if (shouldUpdate) {
// 更新context
if (isOldCxtExist) {
updateOldContext(processing);
}
return createChildren(clazz, processing);
} else {
if (isOldCxtExist) {
setContextChangeCtx(processing, false);
}
return onlyUpdateChildVNodes(processing);
}
}
export function bubbleRender(processing: VNode) {
if (isOldProvider(processing.type)) {
resetOldCtx(processing);
}
}
export function bubbleRender(processing: VNode) {}
// 用于未完成的类组件
export function getIncompleteClassComponent(clazz, processing: VNode, nextProps: object): VNode | null {

View File

@ -1,7 +1,6 @@
import type {VNode} from '../Types';
import {mergeDefaultProps} from './LazyComponent';
import {getOldContext} from '../components/context/CompatibleContext';
import {resetDepContexts} from '../components/context/Context';
import {exeFunctionHook} from '../hooks/HookMain';
import {ForwardRef} from '../vnode/VNodeTags';
@ -54,11 +53,6 @@ export function captureFunctionComponent(
nextProps: any,
shouldUpdate?: boolean
) {
let context;
if (processing.tag !== ForwardRef) {
context = getOldContext(processing, funcComp, true);
}
resetDepContexts(processing);
const isCanReuse = checkIfCanReuseChildren(processing, shouldUpdate);
@ -68,7 +62,7 @@ export function captureFunctionComponent(
const newElements = exeFunctionHook(
processing.tag === ForwardRef ? funcComp.render : funcComp,
nextProps,
processing.tag === ForwardRef ? processing.ref : context,
processing.tag === ForwardRef ? processing.ref : undefined,
processing,
);

View File

@ -4,18 +4,10 @@ import {mergeDefaultProps} from './LazyComponent';
import {ClassComponent} from '../vnode/VNodeTags';
import {resetDepContexts} from '../components/context/Context';
import {getIncompleteClassComponent} from './ClassComponent';
import {
isOldProvider,
resetOldCtx,
cacheOldCtx,
} from '../components/context/CompatibleContext';
function captureIncompleteClassComponent(processing, Component, nextProps) {
processing.tag = ClassComponent;
const hasOldContext = isOldProvider(Component);
cacheOldCtx(processing, hasOldContext);
resetDepContexts(processing);
return getIncompleteClassComponent(Component, processing, nextProps);
@ -32,10 +24,4 @@ export function captureRender(processing: VNode): VNode | null {
return captureIncompleteClassComponent(processing, Component, resolvedProps);
}
export function bubbleRender(processing: VNode) {
// 处理与类组件相同。
const Component = processing.type;
if (isOldProvider(Component)) {
resetOldCtx(processing);
}
}
export function bubbleRender(processing: VNode) {}

View File

@ -92,9 +92,11 @@ export function captureSuspenseComponent(processing: VNode) {
if (showFallback) {
processing.suspenseDidCapture = false;
const nextFallbackChildren = nextProps.fallback;
debugger
return createFallback(processing, nextFallbackChildren);
} else {
const newChildren = nextProps.children;
debugger
return createSuspenseChildren(processing, newChildren);
}
}

View File

@ -2,13 +2,11 @@ import type {VNode} from '../Types';
import {throwIfTrue} from '../utils/throwIfTrue';
import {processUpdates} from '../UpdateHandler';
import {resetNamespaceCtx, setNamespaceCtx} from '../ContextSaver';
import {resetOldCtx} from '../components/context/CompatibleContext';
import {onlyUpdateChildVNodes} from '../vnode/VNodeCreator';
import { createChildrenByDiff } from '../diff/nodeDiffComparator';
export function bubbleRender(processing: VNode) {
resetNamespaceCtx(processing);
resetOldCtx(processing);
}
function updateTreeRoot(processing) {

View File

@ -41,6 +41,7 @@ export class FlagUtils {
node.flags |= Addition;
}
static setAddition(node: VNode) {
console.log('set addition', node.flags);
node.flags = Addition;
}