前端开发实习之数据字典那些事

字典

顾名思义，前后端所约定的对某个字段的定义规则，比如0是女生，1是男生。

应用场景

在展示table的时候，常常会有这样的字段：状态，性别，或是项目某种特定的字段。这时候前端拿到的数据就会是 sex：1。而不是sex：男。这时候就需要前端进行转换处理并展示出来。

主要思路

其实字典就是定义一个对象，key就是值*（1,2…），value就是内容。然后写成一个方法，在插槽中调用方法对应的值，方法return出对应的内容并渲染。

思路很简单，刚开始做的时候我每个页面都写对应的字典，因为项目设计的table众多，导致代码量的极大冗余。

封装成公共的

直接代码了

首先就是建一个common文件夹，一般放在src下面。

const sexMap={

'1':{name:'男',color:'#ccc'},

'2':{name:'女',color:'#fff9'}

}

const characterMap={

'1':{name:'暴躁',color:'#F56C6C'},

'2':{name:'温和',color:'#67C23A'}

}

export {

sexMap,characterMap

}

这里要注意的是抛出对象的时候 如果只有一个 是不能直接export出来的，需要export defalut。

在页面汇总进行引入，一定一定一定记得注册，如果抛出的是对象就在data中注册，如果写的是方法一定要在method中注册