如何封装好一个element表格，实现组件复用，并可以父子传值？

Z时代
2024-02-07
分类：IT

想封装一个表格，以便复用，在每个父组件引用时，可以根据每个父组件要渲染的数据动态更新表格内容

回答：

<template>
  <el-table :data="tableData">
    <el-table-column
      v-for="(column, index) in columns"
      :key="index"
      :prop="column.prop"
      :label="column.label"
    ></el-table-column>
  </el-table>
</template>
<script>
export default {
  name: 'CustomTable',
  props: {
    tableData: {
      type: Array,
      required: true
    },
    columns: {
      type: Array,
      required: true
    }
  }
}
</script>