vue中将后台返回的数字转换成对应的文字
今天遇到一个问题就是性别一栏后台返回我的是数字,但是前端展示的是汉字男女,而且0,1,2,对应不同的汉字,下面跟大家分享一下我的方法
首先用map遍历后台返回的数据利用里面的回调对数据进行解析即可,下面直接上代码
this.usersData.map(function (val) {
if (val.gender == 0) {
val.gender = '未知'
} else if (val.gender == 1) {
val.gender = '男'
} else if (val.gender == 2) {
val.gender = '女'
} else {
return
}
})
这样就可以直接在页面中显示了~
还有一种方式
<el-table
:data="tableData"
border>
<el-table-column
prop="status"
:show-overflow-tooltip="true"
label="状态"
width="60"
:formatter="statusFormatter"
>
</el-table-column>
</el-table>
<script>
export default{
data(){
return{
tableData:[]
}
},
methods:{
statusFormatter(row, column){
const status = row.status
if (status == 0) {
return '正常'
} else if (status == 1) {
return '待审批'
} else if (status == 2) {
return '拒绝'
} else if (status == 3) {
return '锁定'
} else {
return '删除'
}
}
}
}
</script>