javascript - element的表格这种表头怎么实现？

Question

第一行是表头，第二行是搜索框

Answer 1

可以通过$index=0进行判断，显示第二行

<el-table :data="dataList" size="mini" border class="mt15">      <el-table-column label="商户号" align="center">        <template slot-scope="scope">          <el-input            v-if="scope.$index === 0"            size="mini"            v-model="scope.row.customNum"          ></el-input>          <span v-else>{{ scope.row.customNum }}</span>        </template>      </el-table-column>      <el-table-column        label="特约商户号"        prop="customNum1"        align="center"      ></el-table-column>      <el-table-column label="设备号"></el-table-column>      <el-table-column label="微信订单号"></el-table-column>    </el-table>data() {  return {    dataList: [        {          customNum: "",          customNum1: "",        },        {          customNum: 123,          customNum1: 456,        },      ],  }}