有时候请求回来的数据列表只有字典表的对应编码,需要前端从字典表找到对应的文本并展示
如果不想写一大堆循环或者if的话可以用以下的方法来写
下边为模拟的数据
//模拟的数据
let list = [
{
time: "2022/11/17",
name: "A-A-A",
},
{
time: "2022/11/17",
name: "B-B-B",
},
{
time: "2022/11/17",
name: "C-C-C",
},
];
这里的name并不是真正的name 而是后端返回的code 我们需要通过字典表的数据来展示对应的name
//模拟的字典表
let obj = {
'A-A-A': "我是A",
'B-B-B': "我是B",
'C-C-C': "我是C",
};
可以看到这个字典表是个对象,而对象取值的话只需要选择对象的key即可
这里是展示的HTML结构
只需在插值表达式里调用我们过滤的方法,让他返回字典表里对应key的值
<div v-for="item in list" >
{{ filterFn(item.name) }}
</div>
let filterFn = (key) =>{
return obj[key]
}
大致思路就是这样了