Add useFixedHeader, #918

This commit is contained in:
afc163 2016-01-24 15:39:34 +08:00
parent d1b06abdf5
commit e0925a20a8
3 changed files with 48 additions and 0 deletions

View File

@ -0,0 +1,38 @@
# 固定表头
- order: 16
方便一页内展示大量数据。
---
````jsx
import { Table } from 'antd';
const columns = [{
title: '姓名',
dataIndex: 'name',
width: 150,
}, {
title: '年龄',
dataIndex: 'age',
width: 150,
}, {
title: '住址',
dataIndex: 'address',
}];
const data = [];
for (let i = 0; i < 100; i++) {
data.push({
key: i,
name: '李大嘴' + i,
age: 32,
address: '西湖区湖底公园' + i + '号'
});
}
ReactDOM.render(
<Table columns={columns} dataSource={data} pagination={{ pageSize: 50 }} useFixedHeader />
, mountNode);
````

View File

@ -69,6 +69,7 @@ const columns = [{
| locale | 设置排序、过滤按钮的文字或 `title` | Object | | [默认值](https://github.com/ant-design/ant-design/issues/575#issuecomment-159169511) |
| indentSize | 展示树形数据时,每层缩进的宽度,以 px 为单位 | Number | | 15 |
| onRowClick | 处理行点击事件 | Function(record, index) | | 无 |
| useFixedHeader | 是否固定表头 | Boolean | | false |
### Column

View File

@ -77,6 +77,15 @@
width: 60px;
}
&-header + &-body {
overflow: auto;
height: 360px;
}
&-header table {
border-radius: @border-radius-base @border-radius-base 0 0;
}
&-loading {
position: relative;
.@{table-prefix-cls}-body {