feat: 新增嵌套子表格功能和demo，文档。修复rowRef参数bug

build/Table.css

@@ -83,6 +83,8 @@
     background: #f7f7f7; }
     .u-table tr.u-table-expanded-row:hover {
       background: #f7f7f7; }
+    .u-table tr.u-table-expanded-row .u-table {
+      padding: 0 40px 0 20px; }
   .u-table-column-hidden {
     display: none; }
   .u-table-prev-columns-page, .u-table-next-columns-page {

build/Table.js

@@ -449,7 +449,7 @@ var Table = function (_Component) {
       }, onHoverProps, {
         key: key,
         hoverKey: key,
-        ref: rowRef(record, i, indent),
+        ref: rowRef,
         store: this.store
       })));
 

demo/demolist/Demo15.js

@@ -0,0 +1,64 @@
+/**
+*
+* @title 嵌套子表格
+* @description 通过expandedRowRender参数来实现子表格
+*
+*/
+
+import React, { Component } from "react";
+import Table from "../../src";
+
+const columns15 = [
+  { title: "用户名", dataIndex: "a", key: "a", width: 100 },
+  { id: "123", title: "性别", dataIndex: "b", key: "b", width: 100 },
+  { title: "年龄", dataIndex: "c", key: "c", width: 200 },
+  {
+    title: "操作",
+    dataIndex: "d",
+    key: "d",
+    render(text, record, index) {
+      return (
+        <a
+          href="#"
+          onClick={() => {
+            alert("这是第" + index + "列，内容为:" + text);
+          }}
+        >
+          一些操作
+        </a>
+      );
+    }
+  }
+];
+
+const data15 = [
+  { a: "令狐冲", b: "男", c: 41, d: "操作", key: "1" },
+  { a: "杨过", b: "男", c: 67, d: "操作", key: "2" },
+  { a: "郭靖", b: "男", c: 25, d: "操作", key: "3" }
+];
+
+class Demo15 extends Component {
+  expandedRowRender = () => {
+    return (
+      <Table
+        columns={columns15}
+        data={data15}
+        title={currentData => <div>标题: 这是一个标题</div>}
+        footer={currentData => <div>表尾: 我是小尾巴</div>}
+      />
+    );
+  };
+  render() {
+    return (
+      <Table
+        columns={columns15}
+        data={data15}
+        expandedRowRender={this.expandedRowRender}
+        title={currentData => <div>标题: 这是一个标题</div>}
+        footer={currentData => <div>表尾: 我是小尾巴</div>}
+      />
+    );
+  }
+}
+
+export default Demo15;

docs/api.md

@@ -10,7 +10,7 @@
 ### Table
 
 | 参数                     | 说明                                       | 类型                                     | 默认值             |
-|:--|:---|:--|:---|
+| :--------------------- | :--------------------------------------- | :------------------------------------- | :-------------- |
 | data                   | 传入的表格数据                                  | array                                  | []              |
 | columns                | 列的配置表，具体配置见下表                            | array                                  | -               |
 | defaultExpandAllRows   | 默认是否展开所有行                                | bool                                   | false           |
@@ -30,12 +30,14 @@
 | expandIconAsCell       | 是否将expandIcon作为单元格                       | bool                                   | false           |
 | expandIconColumnIndex  | expandIcon的索引，当expandIconAsCell为false时，将插入哪个列 | number                                 | 0               |
 | showHeader             | 是否显示表头                                   | bool                                   | true            |
-|title|表格标题|function|-|
-|footer|表格尾部|function|-|
-|emptyText|无数据时显示的内容|function|() => 'No Data'|
+| title                  | 表格标题                                     | Function                               | -               |
+| footer                 | 表格尾部                                     | Function                               | -               |
+| emptyText              | 无数据时显示的内容                                | Function                               | () => 'No Data' |
 | scroll                 | 横向或纵向支持滚动，也可用于指定滚动区域的宽高度：{ x: true, y: 300 } | object                                 | {}              |
 | rowRef                 | 获取行的ref                                  | Function(record, index, indent):string | () => null      |
 | getBodyWrapper         | 添加对table body的包装                         | Function(body)                         | body => body    |
+| expandedRowRender      | 额外的展开行                                   | Function                               | -               |
+
 
 ### Column
 

src/Table.js

@@ -381,7 +381,7 @@ class Table extends Component{
           {...onHoverProps}
           key={key}
           hoverKey={key}
-          ref={rowRef(record, i, indent)}
+          ref={rowRef}
           store={this.store}
         />
       );

src/Table.scss

@@ -144,6 +144,9 @@ $table-move-in-color: $bg-color-base;
     &:hover {
       background: #f7f7f7;
     }
+    .u-table{
+      padding: 0 40px 0 20px;
+    }
   }
   &-column-hidden {
     display: none;