原生小程序表格table组件

说明

最近需要还原一个table效果，网上找了很多基本不适合，原生的小程序table又很少，本组件是对etable进行优化改良，感谢大佬提供的思路

支持：支持顶部与左边固定表头、自适应列宽，斑马纹，边框，点击事件，表格对齐方式

先上效果 在img

使用介绍

组件在目录components中，复制到项目中使用即可

1、引入

"usingComponents": {
    "easy-table": "/components/easy-table/easy-table"
 }

2、使用

<easy-table 
  border="{{false}}"//边框
  stripe="{{false}}"//斑马纹
  align="center"//对齐方式
  left="{{true}}"//固定左边栏
  y="250"//设置了高度会默认标题top悬浮
  opText="查看详情" //有内容显示操作按钮
  config="{{config}}"
/>

3、表格数据

data:{
  config: {
    //必须
      content: [
      {
        month: '2024-08',
        money: '￥22',
        money1: '￥22'
      },
      {
        month: '2024-08',
        money: '￥22',
        money1: '￥22'
      },
    ],
  titles: ["月份", "结算金额","结算金额"],
  //必须
  props: ['month', 'money','money1'],
  columnWidths: ['270rpx', '270rpx','270rpx']
}
}

• content 数据，数组类型，必填

• titles 头部标题，数组类型，非必填

• props 每一列对应的数据的key值

• columnWidths 每一列的列宽，值类型使用rpx，注意：(titles,props,columnWidths这3个数组的长度需保持一致)

源码在git：https://github.com/aizhaiyu/mini-easy-table