element-ui - table表格中怎么循环数据做特殊处理

想要实现效果:

image.png

实现方法:

      <el-table v-loading="loadingFlag" :data="tabledata" border class="f12">
        <el-table-column prop="agentName" label="已完成kpi">
            <template slot-scope="scope">
                <span >签约:</span>
                <span>{{scope.row.doneQDKpi}}</span>
                <br>
                <span >结单:</span>
                <span>{{scope.row.doneJDKpi}}</span>
            </template>
        </el-table-column>
      </el-table>

在el-table-column 标签中添加 slot-scope属性 scope是每次循环出的对象