需求:
根据每个用户的提交次数、撤回次数,动态计算出实际次数,并且提交次数不能小于撤回次数
<template>
<div>
<el-table
:data="tableData"
style="width: 80%"
border>
<el-table-column
prop="date"
label="日期"
width="120">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="120">
</el-table-column>
<el-table-column
prop="address"
label="地址"
width="250">
</el-table-column>
<el-table-column
prop="submitNumber"
label="提交次数"
width="180">
<template slot-scope="scope">
<el-input-number v-model="scope.row.submitNumber" size="small" :min="scope.row.withdrawNumber" label="描述文字" @change="(currentValue)=>setProNum(currentValue,scope.$index)"></el-input-number>
</template>
</el-table-column>
<el-table-column
prop="withdrawNumber"
label="撤回次数">
</el-table-column>
<el-table-column
prop="actualNumber"
label="实际次数">
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: 'TableRowIndex',
data() {
return {
tableData: [{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
submitNumber:34,
withdrawNumber:2,
actualNumber:32,
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄',
submitNumber:6,
withdrawNumber:3,
actualNumber:3,
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
submitNumber:13,
withdrawNumber:7,
actualNumber:6,
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
submitNumber:34,
withdrawNumber:12,
actualNumber:22,
}]
};
},
methods: {
setProNum(currentValue, index){
this.tableData[index].actualNumber = currentValue - this.tableData[index].withdrawNumber
},
},
};
</script>