el-table,一个el-table-column里,分为两行显示两个后台字段,且分别给它们两个指定label
时间: 2024-01-08 14:02:50 浏览: 119
改变el-table宽度
5星 · 资源好评率100%
可以在`el-table-column`中使用`scoped-slot`来自定义列的内容。你可以使用`<template>`元素来定义这个`scoped-slot`,并在其中使用`<span>`元素来分行显示两个后台字段,并在`<span>`元素中使用`{{}}`来显示后台字段的内容。代码示例如下:
```
<el-table :data="tableData">
<el-table-column label="姓名">
<template slot-scope="scope">
<span>{{ scope.row.name }}</span>
</template>
</el-table-column>
<el-table-column label="分数">
<template slot-scope="scope">
<span>{{ scope.row.score1 }}</span>
<br>
<span>{{ scope.row.score2 }}</span>
</template>
</el-table-column>
</el-table>
```
在上述示例中,我们在第二个列中使用了两个`<span>`元素来分行显示`score1`和`score2`两个后台字段,并使用了`<br>`元素来换行。同时,我们使用了`scope.row.name`、`scope.row.score1`和`scope.row.score2`来显示对应行的数据。
阅读全文