vue 中使用 <el-table-column/> 中的 formatter 格式化内容 🔮
<template>
<!-- 列表 -->
<el-table :data="list">
<!-- 需要格式化的内容 -->
<el-table-column prop="type" label="类型" :formatter="typeFormat">
</el-table-column>
</el-table>
</template>
<script>
export default{
data(){
return{
// 表格数据
list:[],
// 类型
typeOptions:[]
}
},
created(){
this.getList();
// 查询类型字典
this.getDicts('risk_amt_type').then((res) => {
this.typeOptions = res.data;
});
},
methods:{
// 获取表格数据
getList(){
// 后台接收表格数据
this.list=res.data;
},
// 格式化表格内容--类型字典翻译
typeFormat(row) {
console.log(row);
let type = '';
this.typeOptions.forEach(item => {
if (row.type == item.dictValue) {
type = item.dictLabel;
}
});
return type;
},
}
}
</script>
