解决在el-table的label中直接使用:label="name\n(单位)”的问题
解决方案: :render-header=""
示例:
<el-table height="500" :data="phyunitList">
<el-table-column :render-header="renderHeader" label="最大技术出力/(MW)" prop="maxCap" />
<el-table-column :render-header="renderHeader" label="最小技术出力/(MW)" prop="minCap" />
<el-table-column label="操作" align="center" width="180">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
js:
通过'/ '拆分,同一个table内可以定义多个拆分规则。
renderHeader(h, { column }) {
return h('span', {}, [
h('span', {}, column.label.split('/')[0]),
h('br'),
h('span', {}, column.label.split('/')[1])
])
},