【Vue+Element-UI】Table表格：动态Table

前言

客户需求： 实现动态Table，Table表头定制化展示。
实现思路： 参考Element-UI官方Table表格的写法，对Table进行二次封装。全局使用该组件，方便后期维护。

---

一、封装动态表格组件

1.父组件

父组件list.vue：

    <div class="text-right mt-5">
      <el-button type="info" icon="el-icon-s-operation" @click="openCustom">列表定制</el-button>
      <TagColumn :popover-visible.sync="popoverVisible" :columns="columns" @success="updateColumns" />
    </div>
    <TagTable
      ref="tagTable"
      :key="key"
      v-loading="PocManager.queryPocTestApplys.loading"
      :highlight-current-row="true"
      height="calc(100vh - 240px)"
      stripe
      class="mt-5"
      :data-list="gridList"
      :columns="columns"
      @sort-change="sortChange"
      @selection-change="selectionChange"
    >
      <el-table-column slot="before" type="index" label="序号" />
      <el-table-column slot="after" label="操作" width="120px">
        <template slot-scope="scope">
          <el-button type="text" icon="el-icon-edit" @click="openEdit(scope.row)">编辑</el-button>
          <el-button type="text" @click="remove(scope.row)"&