表格组件 TableView
基础显示
tableColumns
表格的主要配置项,内置了component
slot
text
tag
等字段应对不同需求的显示,如有需要其他支持可自行添加,需谨慎修改
::: demo
<<< @/src/demos/table-demo/index.vue
:::
参数说明
参数 | 说明 | 类型 | 可选值 | 默认值 |
tableData | 表格数据 | Array | — | [] |
border | 是否带有纵向边框 | Boolean | — | false |
isSelection | 是否显示多选框 | Boolean | — | false |
tableColumns | 表格列的配置 | Array | — | [] |
tableColumns 配置项
参数 | 说明 | 类型 |
prop | 显示数据对应的字段名称 | String |
minWidth | 对应列的最小宽度 | String |
label | 显示的标题 | String |
slot_name | 用于自定义列的内容,参数为 { row, column, $index },一般多用于负责的数据展示,值需跟slot.name对应 | String |
table_show | 用于判断是否显示当前列,一般用于可配置的表头 | Boolean |
component | 适用于公共的组件,值为注册的组件名称,组件需全局注册 | String |
tag | 内部代码为v-html,适用于标签渲染 | String |
text | 文案渲染 | String |
headerSet | 表格表头的浮动文案,默认浮动在表头文字后的问号icon上,默认已有问号icon | String |
tooltipFont | 表格表头的浮动文案是否浮动在表头文字上,设置为true时,默认浮动在问号icon上的文案,会浮动在表头文案上,问号icon消失,依赖于headerSet存在 | Boolean |
事件说明
事件名 | 说明 | 参数 |
selectionChange | 当选择项发生变化时会触发该事件 | selection |
sortChange | 当表格的排序条件发生变化的时候会触发该事件 | { column, prop, order } |
cellClick | 当某个单元格被点击时会触发该事件 | row, column, cell, event |