el-tab-pane 的label怎么显示很多数据
问:
el-tab-pane 的label怎么显示很多数据
回答:
<el-tabs :tab-position="'left'" style="height: 100%; " @tab-click="onTabClick">
<el-tab-pane
v-for="(item, index) in activities"
:label="item.timestamp"
:key="index">
<span slot="label">
<div style="display: flex; flex-direction: column; justify-content:center; height: 100%; text-align: left; margin-left: 25px;">
<div style="font-size: 14px;">{{ item.timestamp }}</div>
<div style=" font-size: 14px">{{ item.actionPeople }}</div>
<div style=" font-size: 14px;">{{ item.actionNote }}</div>
</div>
</span>
</el-tab-pane>
</el-tabs>
<style scoped lang="scss">
::v-deep .el-tabs__item {
line-height: 20px;//调节三行文字之间的距离
height: 100px;//调节标签页之间的距离
}
</style>
参考链接:el-tabs内容标签el-tab-pane多行显示-CSDN博客