feat(tree): 适应响应式节点数据(proxy对象等)

tree/README.md

@@ -51,3 +51,6 @@ node.getCtx().children();
 ```
 
 具体接口请参考声明文件。
+
+### 开发注意事项
+1. 为了响应式节点（proxy对象）可正常进行操作，**代码中关于节点是否相同的判断，需要判断节点ID相同，而不是节点引用是否相同。**

tree/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@sc/tree",
-  "version": "1.0.3",
+  "version": "1.0.9",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

tree/src/nodeCtx.ts

@@ -24,14 +24,14 @@ export class NodeContext<T = any> {
 
   // 节点在完整、排好序的树数据中的行号
   row(): number {
-    return this.tree.data.indexOf(this.ref);
+    return this.tree.data.findIndex(item => item.ID === this.ref.ID);
   }
 
   // 获取树结构展开显示的行号
   visualRow(): number {
     let row = 0;
     for (const n of this.tree.data) {
-      if (this.ref === n) return row;
+      if (this.ref.ID === n.ID) return row;
       if (n.getCtx().visible()) {
         row += 1;
       }
@@ -41,7 +41,7 @@ export class NodeContext<T = any> {
 
   // 节点在相同父节点下的行号
   rowInParent(): number {
-    return this.brothers().indexOf(this.ref);
+    return this.brothers().findIndex(item => item.ID === this.ref.ID);
   }
 
   // 节点的原始seq数据
@@ -144,7 +144,7 @@ export class NodeContext<T = any> {
   brothers(includeSelf = true): (TreeNode & T)[] {
     let nodes = this.tree.parentMap[this.parentID()] || [];
     if (!includeSelf) {
-      nodes = nodes.filter(node => node !== this.ref);
+      nodes = nodes.filter(node => node.ID !== this.ref.ID);
     }
     return nodes;
   }
@@ -156,13 +156,17 @@ export class NodeContext<T = any> {
   // 获取后兄弟节点们
   nextBrothers(): (TreeNode & T)[] {
     const nodes = this.tree.parentMap[this.parentID()] || [];
-    return nodes.filter(node => node.seq >= this.seq() && node !== this.ref);
+    return nodes.filter(
+      node => node.seq >= this.seq() && node.ID !== this.ref.ID
+    );
   }
 
   // 获取前兄弟节点们
   prevBrothers(): (TreeNode & T)[] {
     const nodes = this.tree.parentMap[this.parentID()] || [];
-    return nodes.filter(node => node.seq <= this.seq() && node !== this.ref);
+    return nodes.filter(
+      node => node.seq <= this.seq() && node.ID !== this.ref.ID
+    );
   }
 
   // 只有前节点存在才可上移

tree/src/tree.ts

@@ -173,7 +173,7 @@ export class Tree<T = any> {
       return null;
     }
     const nodes = this.parentMap[node.parentID];
-    const nodeIndex = nodes.indexOf(node);
+    const nodeIndex = nodes.findIndex(item => item.ID === node.ID);
     if (nodeIndex < 0) {
       return null;
     }
@@ -187,7 +187,7 @@ export class Tree<T = any> {
       return null;
     }
     const nodes = this.parentMap[node.parentID];
-    const nodeIndex = nodes.indexOf(node);
+    const nodeIndex = nodes.findIndex(item => item.ID === node.ID);
     if (nodeIndex < 0) {
       return null;
     }
@@ -339,12 +339,14 @@ export class Tree<T = any> {
         delete this.parentMap[node.ID];
         const nodesInParentMap = this.parentMap[node.parentID];
         if (nodesInParentMap && nodesInParentMap.length) {
-          const nIndex = nodesInParentMap.indexOf(node);
+          const nIndex = nodesInParentMap.findIndex(
+            item => item.ID === node.ID
+          );
           if (nIndex >= 0) {
             toDels.push({ nodes: nodesInParentMap, delNode: node });
           }
         }
-        const index = this.rawData.indexOf(node);
+        const index = this.rawData.findIndex(item => item.ID === node.ID);
         if (index >= 0) {
           this.rawData.splice(index, 1);
         }
@@ -354,7 +356,9 @@ export class Tree<T = any> {
       });
       // 删除parentMap的数据
       toDels.forEach(delItem => {
-        const delIndex = delItem.nodes.indexOf(delItem.delNode);
+        const delIndex = delItem.nodes.findIndex(
+          item => item.ID === delItem.delNode.ID
+        );
         if (delIndex >= 0) {
           delItem.nodes.splice(delIndex, 1);
         }
@@ -467,10 +471,10 @@ export class Tree<T = any> {
       });
     });
     const parentNextBrothers = parent.getCtx().nextBrothers();
-    // 因为seq可能是不连号的，如果上移的最末节点seq，小于下一节点的seq，那就不更新所有下兄弟节点的seq，减少更新的数据量
+    // 因为seq可能是不连号的，如果升级块的最末节点seq，小于下一节点的seq，那就不更新所有下兄弟节点的seq，减少更新的数据量
     const lastNodeCurSeq = updateData[updateData.length - 1].update.seq;
-    const firstBrohter = parentNextBrothers[0];
-    if (lastNodeCurSeq && lastNodeCurSeq >= firstBrohter.seq) {
+    const firstBrother = parentNextBrothers[0];
+    if (lastNodeCurSeq && firstBrother && lastNodeCurSeq >= firstBrother.seq) {
       parentNextBrothers.forEach((node, index) => {
         updateData.push({
           ID: node.ID,
@@ -500,10 +504,8 @@ export class Tree<T = any> {
     const orgParentID = firstNode.parentID;
     const orgBrothers = this.parentMap[orgParentID];
     const lastNodeNextBrothers = lastNode.getCtx().nextBrothers();
-    orgBrothers.splice(
-      orgBrothers.indexOf(firstNode),
-      nodes.length + lastNodeNextBrothers.length
-    );
+    const index = orgBrothers.findIndex(item => item.ID === firstNode.ID);
+    orgBrothers.splice(index, nodes.length + lastNodeNextBrothers.length);
     (this.parentMap[lastNode.ID] || (this.parentMap[lastNode.ID] = [])).push(
       ...lastNodeNextBrothers
     );
@@ -545,7 +547,8 @@ export class Tree<T = any> {
       return;
     }
     const orgBrothers = this.parentMap[firstNode.parentID];
-    orgBrothers.splice(orgBrothers.indexOf(firstNode), nodes.length);
+    const index = orgBrothers.findIndex(item => item.ID === firstNode.ID);
+    orgBrothers.splice(index, nodes.length);
     (this.parentMap[prevNode.ID] || (this.parentMap[prevNode.ID] = [])).push(
       ...nodes
     );
@@ -606,7 +609,8 @@ export class Tree<T = any> {
     const newParentID = parent ? parent.ID : this.rootID;
     const orgParentID = firstNode.parentID;
     const orgBrothers = this.parentMap[orgParentID];
-    orgBrothers.splice(orgBrothers.indexOf(firstNode), nodes.length);
+    const index = orgBrothers.findIndex(item => item.ID === firstNode.ID);
+    orgBrothers.splice(index, nodes.length);
     (this.parentMap[newParentID] || (this.parentMap[newParentID] = [])).push(
       ...nodes
     );