vue table组件封装

组件

<template>
<div class="table-wrap">
  <table class="base-table">
    <slot></slot>
    <tbody>
      <tr v-for="(item,index) in list" :key="index">
        <template v-for="(td,tIndex) in item">
            <td :rowspan="td.row||1"
                :key="tIndex"
                :colspan="td.col||1">{
  {td.val}}</td>
</template>
        </tr>
      </tbody>
    </table>
  </div>

</template>
<script>
export default {
  props: {
    list: {
      type: Array
    },
    data: {
      type: Array
    }
  },
  methods: {}
};
</script>
<style lang="scss" scoped>
table {
  width: 100%;
}

table td,
table th {
  height: 48px;
  font-size: 24px;
  line-height: 36px;
  padding: 10px;
  color: #25262a;
  text-align: center;
  border: 1px solid #fff;