VUE element-ui 之table表格第一行插入输入框

步骤：
模板中配置列：

<el-table-columnlabel="序号"width="70"align="center"><templateslot-scope="scope"><divv-if="scope.$index == 0"/><divv-else>{{ (scope.$index) }}</div></template></el-table-column><el-table-columnlabel="订单编号"width="130"align="center"prop="purchase_order_num"><templateslot-scope="scope"><divv-if="scope.$index == 0"> 注意：判断是第一行插入输入框或下拉菜单等，根据需求做调整<el-inputv-model="inputVal"size="small"placeholder="点击输入编号"/></div><divv-else>{{ (scope.row.purchase_order_num) }}</div></template></el-table-column><el-table-columnlabel="自编号"width="130"align="center"prop="project_name"><templateslot-scope="scope"><divv-if="scope.$index == 0"><el-inputv-model="inputVal"size="small"placeholder="点击输自编号"/></div><divv-else>{{ (scope.row.project_name) }}</div></template></el-table-column>

js部分：

data(){return{       inputVal:'',       Data:[]},

// 更新数据upData(){       dataDetail.getAl(this.params).then(res=>{         res.unshift({})//注意：这一步不能省，否则表格展示数据还是从第一行开始（相当于将第一行数据替换为空）this.Data= res})}

看效果：