ant-design/components/table/demo/fixed-header.md
Junbin Huang d78c0f2707
Chore/fix master conflict (#14126)
* adjust table fixed column z-index (#14036)

fix #13930

* 📝 Add instruction for one column without width left in fixed table

* Add full PR template link in template (#14061)

* add full tmpl link

* adjust

* simplify it

* add cn link

* Fix Affix flickering when scrolling

* update

* fix: top border disappeared under some ie9

* fix calendar month range display (#14049)

* Fix tslint warning

* Correct typescript usage (#14074)

* 🐛 Fix steps style under IE9

close #14001

* 🐛 tweak style for not affecting vertical steps

* 📝 enhance upload documentation

* Input.Group with TimePicker disappear icon: https://codepen.io/mraiguo/pen/QzvvvE?editors=0010

* 🐛 Fix disabled button style in DatePicker panel

https://user-images.githubusercontent.com/507615/50693143-17505400-1071-11e9-9114-b150bef8f7f6.png

* 📝 site: fix BackTop been covered by footer

close #14093

* Update PULL_REQUEST_TEMPLATE.md

* Update pr_cn.md

* 🐛 Fix nested Timeline last item missing line (#14110)

close #14108

* init Spin should also support delay trigger (#14105)

fix #14100

* Update table docs

* bugfix

* Format

* update snapshot

* test: fix spin test
2019-01-06 13:25:59 +08:00

972 B

order title
17
en-US zh-CN
Fixed Header 固定表头

zh-CN

方便一页内展示大量数据。

需要指定 column 的 width 属性,否则列头和内容可能不对齐。(建议留一列不设宽度以适应弹性布局)

en-US

Display large amounts of data in scrollable view.

Specify width of columns if header and cell do not align properly. (Leave one column at least without width to fit fluid layout)

import { Table } from 'antd';

const columns = [{
  title: 'Name',
  dataIndex: 'name',
  width: 150,
}, {
  title: 'Age',
  dataIndex: 'age',
  width: 150,
}, {
  title: 'Address',
  dataIndex: 'address',
}];

const data = [];
for (let i = 0; i < 100; i++) {
  data.push({
    key: i,
    name: `Edward King ${i}`,
    age: 32,
    address: `London, Park Lane no. ${i}`,
  });
}

ReactDOM.render(
  <Table columns={columns} dataSource={data} pagination={{ pageSize: 50 }} scroll={{ y: 240 }} />,
  mountNode
);