fix:懒加载的树状表，在传了expandedRowKeys属性后，会导致点击+号无法展开的问题

build/Table.js

@@ -529,7 +529,7 @@ var Table = function (_Component) {
     }
     var info = this.findExpandedRow(record);
     if (typeof info !== 'undefined' && !expanded) {
-      this.onRowDestroy(record, index);
+      this.onRowDestroy(record, index, true);
     } else if (!info && expanded) {
       var expandedRows = this.getExpandedRows().concat();
       expandedRows.push(this.getRowKey(record, index));
@@ -538,7 +538,7 @@ var Table = function (_Component) {
     this.props.onExpand(expanded, record, index);
   };
 
-  Table.prototype.onRowDestroy = function onRowDestroy(record, rowIndex) {
+  Table.prototype.onRowDestroy = function onRowDestroy(record, rowIndex, isExpandOperation) {
     var expandedRows = this.getExpandedRows().concat();
     var rowKey = this.getRowKey(record, rowIndex);
     var index = -1;
@@ -554,7 +554,15 @@ var Table = function (_Component) {
     if (this.currentHoverKey == rowKey && this.hoverDom) {
       this.hoverDom.style.display = 'none';
     }
+    // todo:如果是TableRow组件卸载触发的该方法，需要加判断，解决懒加载时，持续触发onExpandedRowsChange的问题
+    if (isExpandOperation) {
       this.onExpandedRowsChange(expandedRows);
+    } else {
+      var info = this.findExpandedRow(record);
+      if (typeof info === 'undefined') {
+        this.onExpandedRowsChange(expandedRows);
+      }
+    }
   };
 
   Table.prototype.getRowKey = function getRowKey(record, index) {

build/lib/bigData.js

@@ -67,7 +67,7 @@ function bigData(Table) {
       _this2.endIndex = _this2.currentIndex + _this2.loadCount; //数据结束位置
       _this2.setRowHeight = _this2.setRowHeight.bind(_this2);
       _this2.setRowParentIndex = _this2.setRowParentIndex.bind(_this2);
-      _this2.expandedRowKeys = [];
+      _this2.expandedRowKeys = props.expandedRowKeys || [];
       _this2.flatTreeKeysMap = {}; //树表，扁平结构数据的 Map 映射，方便获取各节点信息
       _this2.flatTreeData = []; //深度遍历处理后的data数组
       _this2.treeData = []; //树表的data数据
@@ -77,7 +77,8 @@ function bigData(Table) {
     BigData.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
       var props = this.props;
       var currentIndex = nextProps.currentIndex,
-          data = nextProps.data;
+          data = nextProps.data,
+          newExpandedKeys = nextProps.expandedRowKeys;
 
       var _this = this,
           dataLen = data.length;
@@ -110,6 +111,15 @@ function bigData(Table) {
       if (currentIndex !== -1 && currentIndex !== this.currentIndex) {
         _this.setStartAndEndIndex(currentIndex, dataLen);
       }
+      if (newExpandedKeys !== props.expandedRowKeys) {
+        _this.cacheExpandedKeys = newExpandedKeys;
+        //重新递归数据
+        var flatTreeData = _this.deepTraversal(data);
+        var sliceTreeList = flatTreeData.slice(_this.startIndex, _this.endIndex);
+        _this.flatTreeData = flatTreeData;
+        _this.handleTreeListChange(sliceTreeList);
+        _this.cacheExpandedKeys = null;
+      }
     };
 
     BigData.prototype.componentWillMount = function componentWillMount() {
@@ -350,7 +360,7 @@ function bigData(Table) {
         setRowHeight: this.setRowHeight,
         setRowParentIndex: this.setRowParentIndex,
         onExpand: this.onExpand,
-        onExpandedRowsChange: this.onExpandedRowsChange,
+        onExpandedRowsChange: this.props.onExpandedRowsChange,
         expandedRowKeys: expandedRowKeys
         //   className={'lazy-table'}
       }));
@@ -632,8 +642,6 @@ function bigData(Table) {
             _this4.setState({ needRender: !needRender });
           }
         }
-      }
-
         if (_this4.treeType) {
           //收起和展开时，缓存 expandedKeys
           _this.cacheExpandedKeys = expandedRowKeys;
@@ -644,6 +652,7 @@ function bigData(Table) {
           _this.handleTreeListChange(sliceTreeList);
           _this.cacheExpandedKeys = null;
         }
+      }
 
       // expandState为true时，记录下
       _this.props.onExpand(expandState, record);

demo/demolist/Demo1404.js

@@ -5,89 +5,100 @@
 * demo1404
 */
 import React, { Component } from "react";
-import {Button} from "tinper-bee";
+import { Button } from "tinper-bee";
 
 import Table from "../../src";
 import BigData from "../../src/lib/bigData";
 const BigDataTable = BigData(Table);
 const columns = [
     {
-        title:'序号',
-        dataIndex:'index',
-        width:'150',
-        key:'index',
-        render:(text,record,index)=>{
+        title: '序号',
+        dataIndex: 'index',
+        width: '150',
+        key: 'index',
+        render: (text, record, index) => {
             return record.index ? record.index : index
         }
     },
-    {title: "用户名", dataIndex: "a", key: "a", width: 580, className: "rowClassName"},
-    { id: "123", title: "性别", dataIndex: "b", key: "b", width: 80},
+    { title: "用户名", dataIndex: "a", key: "a", width: 580, className: "rowClassName" },
+    { id: "123", title: "性别", dataIndex: "b", key: "b", width: 80 },
     { title: "年龄", dataIndex: "c", key: "c", width: 200 }
 ];
 
-const data = [ ...new Array(10) ].map((e, i) => {
+const data = [...new Array(10)].map((e, i) => {
     const rs = { a: i + 'a', b: i + 'b', c: i + 'c', d: i + 'd', key: i };
-  if(i%3==0){
+    if (i % 3 == 0) {
         rs.b = '女';
         rs.children = [];
-      for(let subi=0;subi<3;subi++){
-        rs.children.push({a: i +subi + 'asub', b: i +subi + 'bsub', c: i + subi +'csub', d: i + subi +'dsub', key: i+ `${subi} sub`});
+        for (let subi = 0; subi < 3; subi++) {
+            rs.children.push({ a: i + subi + 'asub', b: i + subi + 'bsub', c: i + subi + 'csub', d: i + subi + 'dsub', key: i + `${subi} sub` });
             rs.children[subi].children = []
-        for(let subj=0;subj<100;subj++){
-          rs.children[subi].children.push({a: 333+' '+subj, b: 333+' '+subj, c: 333+' '+subj, d: 333+' '+subj, key: i+ `${subj} sub1`});
+            for (let subj = 0; subj < 100; subj++) {
+                rs.children[subi].children.push({ a: 333 + ' ' + subj, b: 333 + ' ' + subj, c: 333 + ' ' + subj, d: 333 + ' ' + subj, key: i + `${subj} sub1` });
             }
         }
-  }else{
+    } else {
         rs.children = [];
-      for(let subi=0;subi<3;subi++){
-        rs.children.push({a: i +subi + 'asub', b: i +subi + 'bsub', c: i + subi +'csub', d: i + subi +'dsub', key: i+ `${subi} sub`});
+        for (let subi = 0; subi < 3; subi++) {
+            rs.children.push({ a: i + subi + 'asub', b: i + subi + 'bsub', c: i + subi + 'csub', d: i + subi + 'dsub', key: i + `${subi} sub` });
         }
     }
     return rs;
 })
 
-const data2 = [ ...new Array(10000) ].map((e, i) => {
+const data2 = [...new Array(10000)].map((e, i) => {
     const rs = { a: i + 'a', b: i + 'b', c: i + 'c', d: i + 'd', key: i };
-  if(i%3==0){
+    if (i % 3 == 0) {
         rs.b = '女';
     }
     return rs;
 })
 
 class Demo34 extends Component {
-
     constructor(props) {
         super(props);
         this.state = {
             data: data,
-      selectedRowIndex: 0
+            selectedRowIndex: 0,
+            expandKeys: [0]
         }
     }
-  onExpandedRowsChange = (expandedRowKeys)=>{
-    console.log('expandedRowKeys',expandedRowKeys);
+    /**
+     * expandedRowKeys : 展开行的keys数组
+     */
+    onExpandedRowsChange = (expandedRowKeys) => {
+        // console.log('expandedRowKeys', expandedRowKeys);
+        this.setState({
+            expandKeys:expandedRowKeys
+        })
     }
-  onExpand = (expandKeys)=>{
-    console.log('expand---'+expandKeys);
+    /**
+     * expanded : 当前的状态
+     * record : 当前行的数据
+     */
+    onExpand = (expanded, record) => {
+        console.log('当前的状态---' + expanded, ' 当前行的数据---' , record);
     }
     handleClick = () => {
         this.setState({
             data: data2
         })
     }
-  render() {
+    render () {
         return (
             <div>
-        <Button onClick={this.handleClick} colors="secondary" style={{marginBottom:'8px'}}>改变数据源</Button>
+                <Button onClick={this.handleClick} colors="secondary" style={{ marginBottom: '8px' }}>改变数据源</Button>
                 <BigDataTable
                     columns={columns}
                     data={this.state.data}
                     parentNodeId='parent'
-          scroll={{y:300}}
+                    scroll={{ y: 300 }}
                     onExpand={this.onExpand}
                     onRowClick={(record, index, indent) => {
-            console.log('currentIndex--'+index);
+                        console.log('currentIndex--' + index);
                     }}
                     onExpandedRowsChange={this.onExpandedRowsChange}
+                    expandedRowKeys={this.state.expandKeys}
                 />
             </div>
 

src/Table.js

@@ -364,7 +364,7 @@ class Table extends Component {
     }
     const info = this.findExpandedRow(record);
     if (typeof info !== 'undefined' && !expanded) {
-      this.onRowDestroy(record, index);
+      this.onRowDestroy(record, index, true);
     } else if (!info && expanded) {
       const expandedRows = this.getExpandedRows().concat();
       expandedRows.push(this.getRowKey(record, index));
@@ -373,7 +373,7 @@ class Table extends Component {
     this.props.onExpand(expanded, record,index);
   }
 
-  onRowDestroy(record, rowIndex) {
+  onRowDestroy(record, rowIndex, isExpandOperation) {
     const expandedRows = this.getExpandedRows().concat();
     const rowKey = this.getRowKey(record, rowIndex);
     let index = -1;
@@ -389,7 +389,15 @@ class Table extends Component {
     if(this.currentHoverKey == rowKey && this.hoverDom){
       this.hoverDom.style.display = 'none';
     }
+    // todo:如果是TableRow组件卸载触发的该方法，需要加判断，解决懒加载时，持续触发onExpandedRowsChange的问题
+    if(isExpandOperation){
         this.onExpandedRowsChange(expandedRows);
+    } else {
+        const info = this.findExpandedRow(record);
+        if(typeof info === 'undefined'){
+            this.onExpandedRowsChange(expandedRows);
+        }
+    }
   }
 
   getRowKey(record, index) {

src/lib/bigData.js

@@ -43,14 +43,14 @@ export default function bigData(Table) {
       this.endIndex = this.currentIndex + this.loadCount; //数据结束位置
       this.setRowHeight = this.setRowHeight.bind(this);
       this.setRowParentIndex = this.setRowParentIndex.bind(this);
-      this.expandedRowKeys = [];
+      this.expandedRowKeys = props.expandedRowKeys || [];
       this.flatTreeKeysMap = {}; //树表，扁平结构数据的 Map 映射，方便获取各节点信息
       this.flatTreeData = []; //深度遍历处理后的data数组
       this.treeData = []; //树表的data数据
     }
     componentWillReceiveProps(nextProps) {
       const props = this.props;
-      const {currentIndex ,data} = nextProps;
+      const {currentIndex ,data, expandedRowKeys:newExpandedKeys} = nextProps;
       const _this = this,dataLen = data.length;
       if (nextProps.scroll.y !== props.scroll.y) {
         const rowHeight = nextProps.height ? nextProps.height : defaultHeight;
@@ -84,6 +84,15 @@ export default function bigData(Table) {
       if(currentIndex!==-1 && currentIndex !== this.currentIndex){
         _this.setStartAndEndIndex(currentIndex,dataLen);
       }
+      if(newExpandedKeys !== props.expandedRowKeys){
+        _this.cacheExpandedKeys = newExpandedKeys;
+        //重新递归数据
+        let flatTreeData = _this.deepTraversal(data);
+        let sliceTreeList = flatTreeData.slice(_this.startIndex, _this.endIndex);
+        _this.flatTreeData = flatTreeData;
+        _this.handleTreeListChange(sliceTreeList);
+        _this.cacheExpandedKeys = null;
+      }
 
     }
 
@@ -508,8 +517,6 @@ export default function bigData(Table) {
              this.setState({ needRender: !needRender });
            }
         }
-      }
-      
         if(this.treeType) {
             //收起和展开时，缓存 expandedKeys
             _this.cacheExpandedKeys = expandedRowKeys;
@@ -520,6 +527,7 @@ export default function bigData(Table) {
             _this.handleTreeListChange(sliceTreeList);
             _this.cacheExpandedKeys = null;
         }
+      }
       
       // expandState为true时，记录下
       _this.props.onExpand(expandState, record);
@@ -564,7 +572,7 @@ export default function bigData(Table) {
           setRowHeight={this.setRowHeight}
           setRowParentIndex={this.setRowParentIndex}
           onExpand={this.onExpand}
-          onExpandedRowsChange={this.onExpandedRowsChange}
+          onExpandedRowsChange={this.props.onExpandedRowsChange}
           expandedRowKeys={expandedRowKeys}
           //   className={'lazy-table'}
         />