首页 > Web开发 > 详细

vue el-table 动态列 显示html标签内容

时间:2021-03-29 17:55:18      阅读:216      评论:0      收藏:0      [点我收藏+]
<el-table @row-click="onRowClick" @selection-change="onSelectionChange" ref="testTable" :data="tableData" stripe :height="heightTable  + ‘px‘" style="width: 100%">
<template v-for="(item,index) in tableHead3">
<el-table-column :prop="item.column_name" :label="item.column_comment" v-html="item.column_name" :show-overflow-tooltip="true" align="center" :key="index" >
<template slot-scope="scope">
<span v-html="scope.row[scope.column.property]"></span>
<span v-html="scope.row[item.column_name]"></span>
</template>
</el-table-column>
</template>
</el-table>
export default {
name: ‘Test‘,
data() {
return {
tableHead3:[{code: ‘<span style=‘color:#ff0000‘>test1</span>‘}, {code: ‘<span style=‘color:#ff0000‘>test1</span>‘}],
       tableData: []
}
}
}

  

vue el-table 动态列 显示html标签内容

原文:https://www.cnblogs.com/zkx4213/p/14592891.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!