naive-ui/demo/documentation/components/dataTable/zhCN/fixedHeader.md
2020-02-04 22:43:40 +08:00

56 lines
811 B
Markdown

# 固定头部
在展示大量数据的时候通过设定 `max-height` 来固定头部、滚动数据。
```html
<n-data-table
ref="table"
:columns="columns"
:data="data"
:pagination="pagination"
:max-height="250"
/>
```
```js
const columns = [
{
title: 'Name',
key: 'name'
},
{
title: 'Age',
key: 'age'
},
{
title: 'Address',
key: 'address'
}
]
const data = Array.apply(null, { length: 46 }).map((_, index) => ({
key: index,
name: `Edward King ${index}`,
age: 32,
address: `London, Park Lane no. ${index}`
}))
export default {
data() {
return {
data,
columns,
pagination: {
pageSize: 15
}
}
},
methods: {
sendMail (rowData) {
this.$NMessage.info('send mail to ' + rowData.name)
}
}
}
```