element-ui中el-table中的row-class-name属性的使用场景

今天遇到这样一个需求:
table表格中的评分人评分一列是可以编辑的,并且最终得分这一列需要随着评分人评分列的变化而变化,最终得分不可以进行编辑。
element-ui中el-table中的row-class-name属性的使用场景_第1张图片
首先想到的是最终得分列里使用template标签,里面放一个span标签里使用插值语法,
element-ui中el-table中的row-class-name属性的使用场景_第2张图片

这样乍一看修改评分人评分最终得分页面上会随之修改,但是向接口发请求时,需要把评分人评分和最终得分作为参数传递给接口,评分人评分取值正常,最终得分取值始终为"",遂查看官网,官网中有row-class-name这一项,试试:element-ui中el-table中的row-class-name属性的使用场景_第3张图片
element-ui中el-table中的row-class-name属性的使用场景_第4张图片
在这里插入图片描述
成功。

你可能感兴趣的:(vue.js,elementui,前端)