Element表格组件 el-table 标题行实现换行显示
前言
需要尽量控制el-table展示更多的数据,避免出现横向滚动条。因此对于标题长但是内容短的数据,可以通过标题换行节约空间
效果
实现
vue
<template>
<el-table-column :label="'综合\n评分'" header-align="center" align="center" width="60">
<template slot-scope="scope">
······
</template>
</el-table-column>
</template>
<style scoped>
::v-deep .el-table th>.cell {
white-space: pre-wrap;
}
</style>