vue-elementui表格实现双表头，插入input输入框

效果展示

需要用到table表格的自定义，级联选择器也可以已这种方式插入。其他需要添加什么自己去官网添加！

HTML部分

 <el-table :data="tableData" border style="width: 100%" stripe  height="550">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="订单编号"  prop="sale" :show-overflow-tooltip="true">
          <el-table-column label="订单编号"  prop="sale" :show-overflow-tooltip="true">
            <template slot="header" slot-scope="scope">
              <el-input v-model="qu.personal" size="mini" placeholder="请输入" />
            </template>
          </el-table-column>
        </el-table-column>
</el-table>

注意两层表头prop及label所对应的值必须相同

注意slot-scope="scope"不能删除，只是编译器会提示，页面并不会报错，删掉输入框就无法使用了

js部分

export default {
  data() {
    return {
      qu:{
        personal:'',
      },
      tableData: [
        {
          sale:''
        }
      ],
    };
  }
};