更新记录

1.0.2（2024-03-19）

新增图片显示组件，新增行点击事件

1.0.1（2024-02-24）

新增支持vue3，H5和APP端可以自定义slot内容

1.0.0（2024-02-23）

初始版本

查看更多

平台兼容性

Vue2 Vue3
√ √
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.99 app-vue × √ × × √ √
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × √ √
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
√ √ √ √ √ √ √ √ √

re-table

通用表格组件，支持自适应宽度、固定表头和任意列、格式化内容、操作按钮

props

属性 说明 类型 默认值 可选值 是否必须
data-source 显示的数据 Array<object> -- -- 是
columns 列配置 见下表 Array<object> -- -- 是
bordered 是否显示边框 Boolean false true,false --
show-max-content 单元格内容不换行，用一行完全展示 Boolean false true,false --
show-header 显示表头 Boolean true true,false --
table-layout 列宽度分配方式 String auto auto,fixed --
width 表格宽度 String -- -- --
height 表格高度，设置数值后自动固定表头 String -- -- --
row-key 用于优化行循环，取自data-source[row-key]，支持'a.b.0'形式的嵌套 String id -- 是
overflow-lines 单元格超出指定行数后自动隐藏溢出文字，0为不隐藏 Number 0 -- --
current-row-highlight 当前点击行是否高亮 Boolean false true,false --
header-formatter 表头文字内容格式化方法 Function({column,columnIndex}) -- -- --
value-formatter 表体文字内容格式化方法 Function({column,columnIndex,row,rowIndex}) -- -- --

slot

插槽名 说明
对应columns下对象里的prop值 H5和APP端可以放置任何自定义内容slot，插槽prop为{column,columnIndex,row,rowIndex}，不支持小程序端

组件方法

属性 说明
setCurrentRow 设置当前选中的高亮行，形参为rowIndex，为-1时取消选中行

emit事件

属性 说明
button-click 点击自定义组件里的按钮回调，形参为{name,column,columnIndex,row,rowIndex}，详见项目示例
current-row-change 点击行回调，形参为{row,rowIndex}，current-row-highlight需设置为true

columns 配置

属性 说明 类型 默认 可选值 是否必须
prop 从data-source里取值的字段名，也用于优化列循环的key，不能重名 String -- -- 是
label 标题 String -- -- 是
width 列的宽度 String -- -- 需要固定当前列时必传
fixed 列是否固定；中间列需要固定的话，必须有相邻的固定列 String -- left,right --
hide 隐藏当前列 Boolean false true,false --
header 列头配置 见下表 Object -- -- --
body 列体配置 见下表 Object -- -- --

header 配置

属性 说明 类型 默认 可选值 是否必须
overflow-lines 同table的overflow-lines，作用范围为当前列头 Number 0 -- --

body 配置

属性 说明 类型 默认 可选值 是否必须
overflow-lines 同table的overflow-lines，作用范围为当前列体 Number 0 -- --
components 配置自定义组件，目前仅支持button和image，详见项目示例 Array<<object> -- -- --

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论
加载更多...
插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...