Table 表格

带斑马纹表格

带边框表格

带状态表格

可将表格内容 highlight 显示,方便区分「成功、信息、警告、危险」等内容

固定表头滚动栏

固定列滚动栏

固定列和表头滚动栏

流体高度

当数据量动态变化时,可以为 Table 设置一个最大高度。

多级表头

单选---选择单行数据时使用色块表示。

多选

排序

筛选

对表格进行筛选,可快速查找到自己想看的数据。

自定义列模板

自定义列的显示内容,可组合其他组件使用。

通过 Scoped slot 可以获取到 row, column, $index 和 store(table 内部的状态管理)的数据,用法参考 demo。

展开行

树形数据与懒加载

自定义表头---通过设置 Scoped slot 来自定义表头。

表尾合计行

合并行或列

自定义索引

Table Attributes

参数 说明 类型 可选值 默认值
data 显示的数据 array
height Table 的高度,默认为自动高度。如果 height 为 number 类型,单位 px;如果 height 为 string 类型,则这个高度会设置为 Table 的 style.height 的值,Table 的高度会受控于外部样式。 string/number
max-height Table 的最大高度。合法的值为数字或者单位为 px 的高度。 string/number
stripe 是否为斑马纹 table boolean false
border 是否带有纵向边框 boolean false
size Table 的尺寸 string medium / small / mini
fit 列的宽度是否自撑开 boolean true
show-header 是否显示表头 boolean true
highlight-current-row 是否要高亮当前行 boolean false
current-row-key 当前行的 key,只写属性 String,Number
row-class-name 行的 className 的回调方法,也可以使用字符串为所有行设置一个固定的 className。 Function({row, rowIndex})/String
row-style 行的 style 的回调方法,也可以使用一个固定的 Object 为所有行设置一样的 Style。 Function({row, rowIndex})/Object
cell-class-name 单元格的 className 的回调方法&#x
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值