ui:
<el-row v-for="(item, index) in list " :key="index" class="table-col">
<el-col v-for="( item2, index2 ) in item " :key="index2" :span="24 / item.length" class="table-item">
<span
:class="[item2.title === 'Result' ? activeCls : '', item2.title === 'SN' ? 'darkblue' : '', item2.title === 'Time' ? 'green' : '', item2.title === '工站' ? 'green' : '', labelCls]">{{
item2.title }}</span>
<span :class="[item2.value === 'NG' ? activeCls : '', valueCls]">{{ item2.value }}</span>
</el-col>
</el-row>
参考实现:
UI:
<el-row v-for="(item, index) in list " :key="index" class="table-col">
<el-col v-for="( item2, index2 ) in item " :key="index2" :span="24 / item.length" class="table-item">
<span :class="getTitleClass(item2)">{{ item2.title }}</span>
<span :class="getValueClass(item2, 3, 2)">{{ item2.value }}</span>
</el-col>
</el-row>
shouldHighLight (rowIndex, colIndex) {
const axis = []
const arr = this.list
for (let rowIndex = 0; rowIndex < arr.length; rowIndex++) {
// eslint-disable-next-line no-empty
for (let colIndex = 0; colIndex < arr[rowIndex].length; colIndex++) {
}
}
return axis[rowIndex][colIndex]
}