# 表格参数列表
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
tableAttrs | 表格 column 属性数组(详情见表格 column 属性) | Array | --- | [] |
height | 表格高度 | String | px,%,calc() | calc(100vh - 120px) |
btns_width | 表格行操作按钮宽度 | Number | --- | 185 |
disFuncs | 过滤表格功能 | Array | ['control'--操作,'edit'--编辑, 'del'--删除, 'read'--查看, 'page'--分页] | undefined |
page_align | 分页条显示方式 | String | left ,center, right | center |
# 表格 column 属性
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
key | 对应列内容的字段名 | String | --- | --- |
title | 对应列显示的标题 | String | --- | --- |
val | 对应列值 | any | --- | --- |
col_width | 列宽度 | String | --- | 100px |
align | 列显示方式 | String | left ,center, right | center |
sortable | 列排序 | Boolean | true,false,undefined | undefined |
tooltip | 当内容过长被隐藏时显示 | Boolean | true,false,undefined | undefined |
fixed | 列是否固定在左侧或者右侧,true 表示固定在左侧 | string, boolean | true, left, right | --- |
# Table Events
事件名 | 说明 | 参数 |
---|---|---|
load | 加载表格数据 | {page,pagesize},callBack(list,total) |
edit | 编辑 | rowData,callBack |
del | 删除 | rowData,callBack |
read | 查看详情 | rowData |
dbclick | 行双击事件 | row,column |
# Table Slot 表单 column 各项都可以用插槽重写,slot name=item.key
<g-table :tableAttrs="tdata" height="calc(100vh - 100px)" page_align="flex-end">
<div slot="imgurl">这里重写column 显示</div>
<!-- <el-button type="danger" slot="del" @click="del">重写del</el-button> -->
<div slot="lbtn">
<el-button type="warning" style="margin-right: 2px"
>这里在左边增加功能</el-button
>
</div>
<div slot="rbtn">
<el-button type="info">这里在右边增加功能</el-button>
</div>
<div slot="page">这里可以重写分页ui</div>
</g-table>
name | 说明 |
---|---|
read | 重写查看详情功能 |
edit | 重写编辑功能 |
del | 重写删除功能 |
lbtn | 在操作按钮组左边增加功能 |
rbtn | 在操作按钮组右边增加功能 |
page | 重写分页条 |