VUE element-ui 之table表格双表头、表头内插入输入框

步骤：
模板部分：
就是在表头中嵌套表头，slot="header"是重点，两个表头内label、prop需一致，否则表格内容不显示

        <el-table-column
            type="selection"
            width="55"
            align="center"
            :selectable="checkboxT"
          >
            <el-table-column
              type="selection"
              width="55"
              align="center"
            />
          </el-table-column>
          <!-- slot="header" -->
          <el-table-column label="序号" width="70" align="center">
            <el-table-column label="" width="70" align="center">
              <template slot-scope="scope">
                {{ (scope.$index + 1) }}
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="订单编号" width="130" prop="sale_order_num" :show-overflow-tooltip="true">
            <el-table-column label="订单编号" width="130" prop="sale_order_num" :show-overflow-tooltip="true">
              <template slot="header">
                <el-input v-model="query.saleOrderNum" size="mini" placeholder="请输入" />
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="自编号" width="130" prop="personal_num" :show-overflow-tooltip="true">
            <el-table-column label="自编号" width="130" prop="personal_num" :show-overflow-tooltip="true">
              <template slot="header">
                <el-input v-model="query.personalNum" size="mini" placeholder="请输入" />
              </template>
            </el-table-column>
          </el-table-column>

不需要配置输入框的列：

          <el-table-column label="单价(元/㎡)" width="130" prop="price" sortable :show-overflow-tooltip="true">
            <el-table-column label="" width="130" prop="price" :show-overflow-tooltip="true">
              <template slot="header" />
            </el-table-column>
          </el-table-column>

来看效果：

表格自带排序不受影响，且表头固定。