表格:
<template> <div class="app-container"> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" >增加行</el-button > </el-col> </el-row> <el-table v-loading="loading" :data="gckj_standardList" id="standard_table"> <el-table-column label="满分值" align="center" prop="score" width="120" >
<template slot-scope="scope"> <el-input v-model="scope.row.score" @change="checkScore(scope)"></el-input>
</template>
</el-table-column> <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180" > <template slot-scope="scope"> <el-button size="mini" type="text" icon="el-icon-delete" @click.native.prevent="deleteRow(scope.$index, gckj_standardList)" >删除</el-button > </template> </el-table-column> </el-table> </div> </template>
方法:
methods: { deleteRow(index, rows) { if (rows[index].recid != undefined) { delGckj_standard(rows[index].recid).then((res) =>{ this.getList(); }); } else { rows.splice(index, 1);//从数组中移除scope.$index的元素 } }, checkScore(scope){ var reg=/^(0\.0*[1-9]+[0-9]*$|[1-9]+[0-9]*\.[0-9]*[0-9]$|[1-9]+[0-9]*$)/; var isNumberReg=new RegExp(reg); if(isNumberReg.test(scope.row.score)){ }else{ this.gckj_standardList[scope.$index].score="";//从绑定的: :data="gckj_standardList中去改变值" } }, /** 查询评审标准列表 */ getList() { this.loading = true; listGckj_standard({ bid: this.bid, pztype: this.ptype }).then( (response) => { this.gckj_standardList = response.rows; this.total = response.total; this.loading = false; } ); }, handleAdd() { this.gckj_standardList.push({ recid: undefined, pztype: this.ptype, firstp: undefined, secp: undefined, thirdp: undefined, fourth: undefined, zf: undefined, score: undefined, ssort: undefined, bid: this.bid, }); }, },
原文:https://www.cnblogs.com/yanghongyan/p/14764235.html