前后端交互的时候，后端经常会返回一些int类型的返回值，这个时候前端需要对这种数据类型进行一些处理，渲染在界面上。
比如性别
代码语言：javascript复制 “sex”:XXX,//int,性别 0表示女 1表示男，比如状态：
代码语言：javascript复制“status”:XXX,//int,作业状态 0：待审批 1：已同意 -1：未同意比如等级
代码语言：javascript复制"level": xxx //int型，级别，0表示优秀 ，1表示良好，2表示中等，3表示较差这里就需要用到filters过滤的方法，时间戳的处理其实和jquery里面用到的是一样的。
参考代码
代码语言：javascript复制<template>
<view>
<view class="padding-xl" v-for="(item,index) in fenecList.fences" :key="index">
<text>性别：{{item.sex | formatSex}} </text>
<text>状态：{{item.status | formatStatus}} </text>
<text>等级：{{item.level | formatLevel}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
fenecList: [],
};
},
onLoad() {
this.getList();
},
methods: {
getList() {
uni.request({
url: "../../static/test.json",
method: 'get',
dataType: 'json',
success: (res) => {
console.log(res.data);
this.fenecList = res.data.info;
},
});
},
},
filters: {
// 格式化性别
formatSex: function(str) {
const sexEnum = {
"0": "女",
"1": "男",
}
return sexEnum[str];
},
// 格式化状态
formatStatus: function(str) {
const statusEnum = {
"0": "待审批 ",
"1": "已同意",
"-1": "未同意",
}
return statusEnum[str];
},
// 格式化等级
formatLevel: function(str) {
const LevelEnum = {
"0": "优秀",
"1": "良好",
"2": "中等",
"3": "差劲",
}
return LevelEnum[str];
}
},
}
</script>
<style>
</style>test.json
代码语言：javascript复制{
"retCode": 1,
"info": {
"configName": "家庭作业",
"fences": [{
"sex": 1,
"status": 0,
"level": 1
},{
"sex": 0,
"status": 1,
"level": 1
},{
"sex": 1,
"status": 0,
"level": 1
},{
"sex": 0,
"status": -1,
"level": 0
}]
}
}显示如下：
