Match-id-eb73774c1a152584504f6ce5531febfedfcf3b83

This commit is contained in:
* 2022-01-26 10:45:38 +08:00 committed by *
parent dea643344b
commit 6e19d6b6af
1 changed files with 18 additions and 7 deletions

View File

@ -309,23 +309,34 @@ function unmountDomComponents(vNode: VNode): void {
function submitClear(vNode: VNode): void { function submitClear(vNode: VNode): void {
const realNode = vNode.realNode; const realNode = vNode.realNode;
const cloneDom = realNode.cloneNode(false); // 复制节点后horizon的两个属性消失 const cloneDom = realNode.cloneNode(false); // 复制节点后horizon添加给dom的属性未能复制
const customizeKeys = Object.keys; // 真实 dom 获取的keys只包含新增的属性
// 比如真实 dom 拿到的 keys 一般只有两个 horizon 自定义属性
// 但考虑到用户可能自定义其他属性,所以采用遍历赋值的方式
const customizeKeys = Object.keys(realNode);
const keyLength = customizeKeys.length; const keyLength = customizeKeys.length;
for(let i = 0; i < keyLength; i++) { for(let i = 0; i < keyLength; i++) {
const key = customizeKeys[i]; const key = customizeKeys[i];
cloneDom[key] = realNode(key); // 测试代码 mock 实例的全部可遍历属性都会被Object.keys方法读取到
// children 属性被复制意味着复制了子节点,因此要排除
if (key !== 'children') {
cloneDom[key] = realNode[key]; // 复制cloneNode未能复制的属性
}
} }
const parentObj = findDomParent(vNode); const parentObj = findDomParent(vNode);
const currentParent = parentObj.parentDom; const currentParent = parentObj.parentDom;
const clearChild = vNode.clearChild as VNode; let clearChild = vNode.clearChild as VNode; // 上次渲染的child保存在clearChild属性中
// 卸载子vNode递归遍历子vNode // 卸载 clearChild 和 它的兄弟节点
unmountNestedVNodes(clearChild); // node.child 为空需要添加原有的child while(clearChild) {
// 卸载子vNode递归遍历子vNode
unmountNestedVNodes(clearChild);
clearVNode(clearChild);
clearChild = clearChild.next as VNode;
}
// 在所有子项都卸载后删除dom树中的节点 // 在所有子项都卸载后删除dom树中的节点
removeChildDom(currentParent, vNode.realNode); removeChildDom(currentParent, vNode.realNode);
clearVNode(clearChild);
currentParent.append(cloneDom); currentParent.append(cloneDom);
vNode.realNode = cloneDom; vNode.realNode = cloneDom;
FlagUtils.removeFlag(vNode, Clear); FlagUtils.removeFlag(vNode, Clear);