mirror of https://github.com/ElemeFE/element
对表格当没有内容显示时,显示一个"友好的暂无数据"字,还有就是添加一个在表格里面插入slot="bottom"一个分页组件位置的说明
parent
65d6938ddf
commit
37f51f42cd
|
@ -678,7 +678,7 @@
|
|||
|
||||
### 排序
|
||||
|
||||
对表格进行排序,可快速查找或对比数据。
|
||||
对表格进行排序,可快速查找或对比数据。(在el-table里面可以插件一个slot="bottom"的组件,作为自己的分页)
|
||||
|
||||
:::demo 在列中设置`sortable`属性即可实现以该列为基准的排序,接受一个`Boolean`,默认为`false`。在本例中,我们还使用了`formatter`属性,它用于格式化指定列的值,接受一个`Function`,会传入两个参数:`row`和`column`,可以根据自己的需求进行处理。
|
||||
```html
|
||||
|
@ -703,6 +703,7 @@
|
|||
label="地址"
|
||||
:formatter="formatter">
|
||||
</el-table-column>
|
||||
<div slot="bottom">这里可以存放分页插件</div>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
|
|
|
@ -32,6 +32,7 @@ export default {
|
|||
|
||||
render(h) {
|
||||
return (
|
||||
<div>
|
||||
<table
|
||||
class="el-table__body"
|
||||
cellspacing="0"
|
||||
|
@ -68,6 +69,12 @@ export default {
|
|||
}
|
||||
</tbody>
|
||||
</table>
|
||||
{
|
||||
this.data.length === 0
|
||||
? (<div style={{paddingTop: '20px', textAlign: 'center', paddingBottom: '20px'}}>暂无数据显示!!</div>)
|
||||
: ''
|
||||
}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<div class="el-table__fixed-header-wrapper" v-if="fixedColumnCount > 0">
|
||||
<table-header :columns="fixedColumns" :all-selected="allSelected" @allselectedchange="handleAllSelectedChange" :selection="selection" :style="{ width: fixedBodyWidth ? fixedBodyWidth + 'px' : '' }" :border="border"></table-header>
|
||||
</div>
|
||||
<div class="el-table__fixed-body-wrapper" v-if="fixedColumnCount > 0" :style="{ top: headerHeight + 'px' }">
|
||||
<div class="el-table__fixed-body-wrapper" v-if="fixedColumnCount > 0 && filterData.length > 0" :style="{ top: headerHeight + 'px' }">
|
||||
<table-body :columns="fixedColumns" fixed :selection="selection" :data="filterData" :style="{ width: fixedBodyWidth ? fixedBodyWidth + 'px' : '' }"></table-body>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue