基于uniapp封装的table组件

数据格式

复制代码
tableData: [
        {
          elcInfo: [{
            tableData:[
                1,
              293021.1,
              293021.1,
              293021.1,
              293021.1,
            ]
          }]
        },
        {
          elcInfo: [{
            tableData:[
              1,
              293021.1,
              293021.1,
              293021.1,
              293021.1,
            ]
          }]
        },
        {
          elcInfo: [{
            tableData:[
              1,
              293021.1,
              293021.1,
              293021.1,
              293021.1,
            ]
          }]
        },
       /* {
          title: "2",
          elcInfo: [{
            tableData:[
              293021.1,
              293021.1,
              293021.1,
              293021.1,
            ]
          }]
        },
        {
          title: "3",
          elcInfo: [{
            tableData:[
              293021.1,
              293021.1,
              293021.1,
              293021.1,
            ]
          }]
        },*/
      ],
      tableHeader: {
        dateData: [
      '序号', "结算类型","电量","电价","电费"
        ]
      },

子组件:

复制代码
<template>
  <u-table>
    <u-tr>
      <u-th v-for="item in header">{{item}}</u-th>
    </u-tr>
    <u-tr v-for="item in data">
      <u-td v-for="i in item">{{ i }}</u-td>
    </u-tr>
  </u-table>
</template>

<script>
export default {
  name: "XTable",
  props: {
    header: {
      type: Object,
      default: {},
    },
    data: [],
  },
}
</script>
相关推荐
P7Dreamer7 小时前
Tailwind CSS 日常使用
前端·css
默默地离开7 小时前
深入理解CSS盒子模型:从基础到实战 (第四回)
前端·css
普宁彭于晏7 小时前
uni-app switch(开关选择器) BUG
uni-app·bug
遗憾随她而去.8 小时前
前端css 的固定布局,流式布局,弹性布局,自适应布局,响应式布局
前端·css
前端赵哈哈8 小时前
🚀 从 Windi CSS 迁移到 Tailwind CSS v4 完整实践指南
前端·css·vue.js
walking9579 小时前
在SCSS中使用BEM命名规范
前端·css
一梦浮华10 小时前
自学嵌入式 day37 HTML
前端·html
前端老鹰10 小时前
HTML <dialog> 元素:原生弹窗解决方案,无需再写复杂遮罩
前端·html
Caster_Z12 小时前
Java把word转HTML格式
java·html·word
低代码布道师15 小时前
HTML5 `<figure>` 标签:提升网页语义化与可访问性的利器
前端·html·html5