element-ui table表格。数组对应的一组数据占有两行怎么处理?

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;

element-ui table表格。数组对应的一组数据占有两行怎么处理?