element ui table 表格 获取到数据之后让其中两个单元格相乘

Question

<el-table-column label="数量" width="65" prop="size" align="center">
    <template slot-scope="scope">
        <el-input type="textarea" resize="none" autosize v-model="scope.row.size" @change="handleEdit(scope.$index, scope.row)"></el-input>
    </template>
</el-table-column>

<el-table-column label="采购单价（元）" width="124" prop="purchasePrice" align="center">
    <template slot-scope="scope">
        <el-input type="textarea" resize="none" autosize v-model="scope.row.purchasePrice" @change="handleEdit(scope.$index, scope.row)"></el-input>
    </template>
</el-table-column>

tableInfo:{
    tableData: [
        {
            size:'10',
            purchasePrice:'10',
        }
    ],
},

handleEdit(index, row) {
    if(row.size && row.purchasePrice){
        row.purchaseMoney = Number(row.size)*Number(row.purchasePrice)
    }
},

写在change事件里可以计算出来

如果是一进页面 从后台获取到数量和单价 如何执行计算呢？

未来数据会是35行 计算出来怎么知道是哪行的合呢

Answer 1

 this.tableInfo.tableData.forEach((v,i)=>{
        if(v.size && v.purchasePrice){
            v.purchaseMoney = Number(v.size)*Number(v.purchasePrice)
        }
    })

自己答了 每次进页面遍历一遍数据 相乘 放在一个格子里就好了。。。