element-ui table表格。数组对应的一组数据占有两行怎么处理?
下面的评语是用来评价上面一行的。
data数据是这样的
tableData5: [{
id: '12987122',
zonename: '光明校区',
subject: '语文',
grade: '99',
gradelevel: '88',
gradehigh: '100',
isadmission: '是',
comment: '你真的很棒再接再厉吧',
},{
id: '12987122',
zonename: '光明校区',
subject: '数学',
grade: '99',
gradelevel: '88',
gradehigh: '100',
isadmission: '是',
comment: '你真的很棒再接再厉吧',
},
<el-table :data="tableData5"
default-expand-all //默认展开行
style="width: 100%">
<el-table-column type="expand"> //当前行可以展开
<template slot-scope="props">
评价:{{ props.row.comment}}
</template>
</el-table-column>
<el-table-column label="校区" prop="zonename">
</el-table-column>
<el-table-column label="科目" prop="subject">
</el-table-column>
<el-table-column label="得分" prop="grede">
</el-table-column>
<el-table-column label="平均分" prop="gredelevel">
</el-table-column>
<el-table-column label="最高分" prop="gredehigh">
</el-table-column>
<el-table-column label="录取" prop="isadmission">
</el-table-column>
</el-table>
这样写出来可能和上面的效果图不太一样。每行前面有个可以点击的箭头。但是你可以修改css,让这个箭头display:none;