Match-id-3c7ea104b59b05b9574e7377e9f1a9cc856dd275

This commit is contained in:
* 2022-01-20 14:59:39 +08:00 committed by *
commit a3014f3da3
5 changed files with 15 additions and 21 deletions

View File

@ -2,7 +2,6 @@ export { VNode } from './vnode/VNode';
type Trigger<A> = (A) => void; type Trigger<A> = (A) => void;
export type ReadContextHookType = { readContext<T>(context: ContextType<T>): T };
export type UseStateHookType = { export type UseStateHookType = {
useState<S>( useState<S>(
initialState: (() => S) | S initialState: (() => S) | S

View File

@ -35,11 +35,8 @@ export function newUpdate(): Update {
// 将update对象加入updates // 将update对象加入updates
export function pushUpdate(vNode: VNode, update: Update) { export function pushUpdate(vNode: VNode, update: Update) {
const updates = vNode.updates; const updates = vNode.updates;
if (updates === null) {
return;
}
updates.push(update); updates?.push(update);
} }
// 根据update获取新的state // 根据update获取新的state

View File

@ -354,9 +354,9 @@ function diffArrayNodes(
// 把剩下的currentVNode转成Map // 把剩下的currentVNode转成Map
const leftChildrenMap = transLeftChildrenToMap(oldNode, rightEndOldNode); const leftChildrenMap = transLeftChildrenToMap(oldNode, rightEndOldNode);
// 通过贪心算法+二分法获取最长递增子序列 // 通过贪心算法+二分法获取最长递增子序列
const eIndexes = []; // 记录 eIndex 值 const eIndexes: Array<number> = []; // 记录 eIndex 值
const result = []; // 记录最长子序列在eIndexes中的 index 值 const result: Array<number> = []; // 记录最长子序列在eIndexes中的 index 值
const preIndex = []; // 贪心算法在替换的过程中会使得数组不正确通过记录preIndex找到正确值 const preIndex: Array<number> = []; // 贪心算法在替换的过程中会使得数组不正确通过记录preIndex找到正确值
const reuseNodes = []; // 记录复用的 VNode const reuseNodes = []; // 记录复用的 VNode
let i = 0; let i = 0;
for (; leftIdx < rightIdx; leftIdx++) { for (; leftIdx < rightIdx; leftIdx++) {
@ -367,6 +367,7 @@ function diffArrayNodes(
// 从Map删除后面不会deleteVNode // 从Map删除后面不会deleteVNode
leftChildrenMap.delete(newNode.key || leftIdx); leftChildrenMap.delete(newNode.key || leftIdx);
} }
if (oldNodeFromMap !== null) { if (oldNodeFromMap !== null) {
let eIndex = newNode.eIndex; let eIndex = newNode.eIndex;
eIndexes.push(eIndex); eIndexes.push(eIndex);
@ -380,7 +381,7 @@ function diffArrayNodes(
let middle; let middle;
// 二分法找到需要替换的值 // 二分法找到需要替换的值
while (start < end) { while (start < end) {
middle = Math.floor((start + end) / 2) middle = Math.floor((start + end) / 2);
if (eIndexes[result[middle]] > eIndex) { if (eIndexes[result[middle]] > eIndex) {
end = middle; end = middle;
} else { } else {
@ -403,6 +404,7 @@ function diffArrayNodes(
appendNode(newNode); appendNode(newNode);
} }
} }
if (isComparing) { if (isComparing) {
// 向前回溯找到正确的结果 // 向前回溯找到正确的结果
let length = result.length; let length = result.length;
@ -411,9 +413,9 @@ function diffArrayNodes(
result[length] = prev; result[length] = prev;
prev = preIndex[result[length]]; prev = preIndex[result[length]];
} }
result.forEach(i => { result.forEach(idx => {
// 把需要复用的节点从 restNodes 中清理掉,因为不需要打 add 标记,直接复用 dom 节点 // 把需要复用的节点从 restNodes 中清理掉,因为不需要打 add 标记,直接复用 dom 节点
reuseNodes[i] = null; reuseNodes[idx] = null;
}); });
reuseNodes.forEach(node => { reuseNodes.forEach(node => {
if (node !== null) { if (node !== null) {
@ -490,7 +492,7 @@ function diffStringNodeHandler(
firstChildVNode: VNode, firstChildVNode: VNode,
isComparing: boolean isComparing: boolean
) { ) {
let newTextNode = null; let newTextNode: VNode | null = null;
// 第一个vNode是Text则复用 // 第一个vNode是Text则复用
if (firstChildVNode !== null && firstChildVNode.tag === DomText) { if (firstChildVNode !== null && firstChildVNode.tag === DomText) {
@ -520,7 +522,7 @@ function diffObjectNodeHandler(
firstChildVNode: VNode, firstChildVNode: VNode,
isComparing: boolean isComparing: boolean
) { ) {
let canReuseNode = null; let canReuseNode: VNode | null = null;
// 通过key比对是否有可以reuse // 通过key比对是否有可以reuse
const newKey = newChild.key; const newKey = newChild.key;
@ -535,7 +537,7 @@ function diffObjectNodeHandler(
} }
} }
let resultNode = null; let resultNode: VNode | null = null;
let startDelVNode = firstChildVNode; let startDelVNode = firstChildVNode;
if (newChild.vtype === TYPE_ELEMENT) { if (newChild.vtype === TYPE_ELEMENT) {
if (canReuseNode) { if (canReuseNode) {

View File

@ -186,11 +186,6 @@ function detachRef(vNode: VNode, isOldRef?: boolean) {
// 卸载一个vNode不会递归 // 卸载一个vNode不会递归
function unmountVNode(vNode: VNode): void { function unmountVNode(vNode: VNode): void {
// TODO 暂时用于规避error处理逻辑后续删除
if (vNode.flags.Addition) {
return;
}
switch (vNode.tag) { switch (vNode.tag) {
case FunctionComponent: case FunctionComponent:
case ForwardRef: case ForwardRef:

View File

@ -19,7 +19,7 @@ export const ShouldCapture = 'ShouldCapture';
// For suspense // For suspense
export const ForceUpdate = 'ForceUpdate'; export const ForceUpdate = 'ForceUpdate';
const flagArr = [Addition, Update, Deletion, ResetText, Callback, DidCapture, Ref, Snapshot, Interrupted, ShouldCapture, ForceUpdate]; const FlagArr = [Addition, Update, Deletion, ResetText, Callback, DidCapture, Ref, Snapshot, Interrupted, ShouldCapture, ForceUpdate];
const LifecycleEffectArr = [Update, Callback, Ref, Snapshot]; const LifecycleEffectArr = [Update, Callback, Ref, Snapshot];
@ -38,9 +38,10 @@ export class FlagUtils {
} }
static hasAnyFlag(node: VNode) { // 有标志位 static hasAnyFlag(node: VNode) { // 有标志位
let keyFlag = false; let keyFlag = false;
flagArr.forEach(key => { FlagArr.forEach(key => {
if (node.flags[key]) { if (node.flags[key]) {
keyFlag = true; keyFlag = true;
return;
} }
}); });
return keyFlag; return keyFlag;