修复 Nested Table 分页后展开收起不可用的问题

baidu · Oct 19, 2020 · 5209385 · 5209385
1 parent a6a1b7b
commit 5209385
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 7 deletions.
diff --git a/src/renderers/Table/TableContent.tsx b/src/renderers/Table/TableContent.tsx
@@ -6,6 +6,7 @@ import {TableRow} from './TableRow';
 import {filter} from '../../utils/tpl';
 import {observer} from 'mobx-react';
 import {trace, reaction} from 'mobx';
+import {flattenTree} from '../../utils/helper';
 
 export interface TableContentProps {
   className?: string;
@@ -56,7 +57,9 @@ export class TableContent extends React.Component<TableContentProps> {
 
     this.reaction = reaction(
       () =>
-        `${rows.map(item => item.id).join(',')}${rows
+        `${flattenTree(rows)
+          .map(item => `${item.id}`)
+          .join(',')}${rows
           .filter(item => item.checked)
           .map(item => item.id)
           .join(',')}`,
@@ -109,7 +112,7 @@ export class TableContent extends React.Component<TableContentProps> {
           {...itemProps}
           classnames={cx}
           checkOnItemClick={checkOnItemClick}
-          key={item.index}
+          key={item.id}
           itemIndex={rowIndex}
           item={item}
           itemClassName={cx(
@@ -138,7 +141,7 @@ export class TableContent extends React.Component<TableContentProps> {
               {...itemProps}
               classnames={cx}
               checkOnItemClick={checkOnItemClick}
-              key={`foot-${item.index}`}
+              key={`foot-${item.id}`}
               itemIndex={rowIndex}
               item={item}
               itemClassName={cx(
@@ -158,7 +161,7 @@ export class TableContent extends React.Component<TableContentProps> {
             />
           );
         }
-      } else if (Array.isArray(item.data.children)) {
+      } else if (item.children.length) {
         // 嵌套表格
         doms.push(
           ...this.renderRows(item.children, columns, {

diff --git a/src/store/table.ts b/src/store/table.ts
@@ -176,8 +176,35 @@ export const Row = types
     },
 
     replaceWith(data: any) {
-      delete data.id;
-      Object.keys(data).forEach(key => ((self as any)[key] = data[key]));
+      Object.keys(data).forEach(key => {
+        if (key !== 'id') {
+          (self as any)[key] = data[key];
+        }
+      });
+
+      if (Array.isArray(data.children)) {
+        const arr = data.children;
+        const pool = arr.concat();
+
+        // 把多的删了先
+        if (self.children.length > arr.length) {
+          self.children.splice(arr.length, self.children.length - arr.length);
+        }
+
+        let index = 0;
+        const len = self.children.length;
+        while (pool.length) {
+          const item = pool.shift()!;
+
+          if (index < len) {
+            self.children[index].replaceWith(item);
+          } else {
+            const row = Row.create(item);
+            self.children.push(row);
+          }
+          index++;
+        }
+      }
     }
   }));
 
@@ -653,7 +680,6 @@ export const TableStore = iRendererStore
           pristine: item,
           data: item,
           rowSpans: {},
-          modified: false,
           children:
             item && Array.isArray(item.children)
               ? initChildren(item.children, depth, key, id)