怎么做可以把el-select中的数据添加到el-table的列中？

Question

有一个需求需要把el-table下拉框选中的数据添加到后面的列中，下拉框的数据如下图红色区域中的数组，循环得到option。每一条数据中有一个‘ContentScore’属性（蓝色框中），需要把该数据添加到el-table蓝色框中，应该怎么实现。现在el-table蓝色框中的数据绑定的是最外层的‘ContentScore’属性，不是option的。

下面是代码部分

<el-table-column align="center" label="具体内容" >
    <template slot-scope="scope">
        <el-select v-model="scope.row.ContentID" placeholder="请选择" @change="watchSelect($event)" ref="selectOption">
            <el-option
                    v-for="item of scope.row.ItemContent"
                    :key="item.PKID"
                    :label="item.ContentName"
                    :value="item.PKID">
            </el-option>
        </el-select>
    </template>
</el-table-column>
<el-table-column align="center" label="得分">
    <template slot-scope="scope">
        <span>{{scope.row.ContentScore}}</span>
    </template>
</el-table-column>

想请教大神帮忙看看，谢谢

Answer 1

选中option之后将这个option的ContentScore属性赋值给表格的这条数据就行了。
在change事件里赋值，使用$index可以获取到该条表格数据的下标

更新：大概就是这么写的

watchSelect(val, index){
  // 绑定watchselect事件的时候将index放进参数，scope.$index
  // 根据option的pkid获取到它的ContentScore属性
  optionList.forEach(item => {
    if (item.pkid == val) tableData[index].ContentScore = item.ContentScore
  })
}