在做项目的过程中,遇到了一个新问题,就是要将后台数据映射为特定的内容,应该算是内容转换吧。。比如说性别,后台存储的数据可能为0,1,分别表示为男生,女生。那么在前端就不能直接显示0,1,而是要依据你所存储的数据进行显示可以让用户明白的内容。
那这个该如何做呢?
我用的是vue框架,里边有一个filter的过滤函数。可以直接在vue的单文件组件里使用。但在做项目的时候为了代码的美观,并易于维护,可以新建一个js文件,专门实现这样类似的问题。
let Filter = {};
Filter.install = function (Vue) {
if (Vue) {
function calLessTen(value) {
if (value < 10) {
return '0' + value
} else {
return '' + value
}
}
Vue.filter('sex_filter',function (value) {
let map = ["男","女"];
return map[value];
});
vue中可以直接使用
<template>
<div>{{male|sex_filter}}</div>
<div>{{female|sex_filter}}</div>
</template>
<script>
data:{
return{
male:0,
female:1
}
}
</script>
<style>
</style>
这样就大功告成了!!!