在工作中,可能会遇到elementUI表格上线显示状态的值为(新建,处理中),显示出来却是对应的数字,的问题.
解决:
1.在elementUI表格结构上使用插槽.
<el-table-column label="状态">
<template #default="scope">
<!-- 插值表达式支持函数执行 并且渲染的是函数的return值 -->
{{ formatEmployment(scope.row.zt) }}
</template>
</el-table-column>
2.在 methods中定义这个函数.
formatEmployment (type) {
// 根据源数据经过处理 把处理之后的数据返回
// 定义一个映射结构
const map = {
10: '新建',
20: '处理中',
30: '审核不通过',
40: '处理结束'
}
return map[type]
}
效果图: