【APP VTable】和市面上的 Table 组件一样，都是接收表格[] 以及数据源[]

<template>
  <view class="scroll-table-wrapper">
    <view class="scroll-table-container">
      <table class="scroll-table">
        <thead>
          <tr>
            <th v-for="(item, index) in columns" :key="index">
              {{ item.title }}
            </th>
          </tr>
        </thead>
        <!-- 表格内容 -->
        <tbody v-if="dataSource.length > 0">
          <tr v-for="(row, rowIndex) in dataSource" :key="rowIndex">
            <td v-for="(cell, cellIndex) in columns" :key="cellIndex">
              <view v-if="cell.title !== '操作'"
                :style="{'width': cell.width, 'white-space': cell.width ? 'normal' : 'nowrap', 'text-align': 'center'}"
                @click="handleArrowClick(row, cell, type)">
                {{ row[cell.dataIndex] || '' }}
              </view>
              <view v-else>
                <button @click="handleButtonClick(row)" class="op-after-0">{{operateTitle}}</button>
              </view>
            </td>
          </tr>
        </tbody>
        <tbody v-else>
          <tr style="text-align: center;">
            <td :colspan="columns.length">暂无数据</td>
          </tr>
        </tbody>
      </table>
    </view>
  </view>
</template>
<script>
  export default {
    /**
     * @author _LJaXi
     * @columns 表头内容
     * @dataSource 表格数据源
     * @operateTitle 操作按钮title
     * @updatehandleOperate 操作栏按钮获取row
     * @updateshow 单击单元格获取row
     */
    props: {
      columns: {
        type: Array,
        default: []
      },
      dataSource: {
        type: Array,
        default: []
      },
      // 状态
      type: {
        type: String,
        default: ''
      },
      operateTitle: {
        type: String,
        default: '操作'
      }
    },
    methods: {
      handleArrowClick(item, type) {
        this.$emit('update:show', {
          item,
          type: this.type
        })
      },
      handleButtonClick(item) {
        this.$emit('update:handleOperate', {
          item
        })
      }
    }
  }
</script>
<style lang="less" scoped>
  @import url('index.less');
</style>

<VTable 
  :columns="maintenanceFeedbackTableData" 
  :dataSource="tableData"
  @update:show="handleShow" 
  @update:handleOperate="handleOperate" 
/>