使用场景
- 后端给你返回的是0,1,2,3,4的code码情况下,你需要根据字典来对应的渲染出不同的内容
- 这样不需要在每个文件里面都去写filter方法过滤渲染字段
一:创建文件
utils文件夹下创建一个dataDictionary.js文件
二:需要过滤的数据如下进行设置
const dataJson = {
// 自定义属性 - 填写格式
field_type: { 1: '吃饭', 2: '喝水', 3: 'wc', 4: '睡觉', 5: '游戏', 6: '邮箱', 7: '手机' }
}
export default dataJson
三:引入注册
main.js引入全局注册使用
import dataDic from './utils/dataDictionary'
Vue.prototype.$dataDic = dataDic
四:使用
template里面
{{$dataDic.field_type[row.field_type]}}调用
或者在多选里面生成下拉的选择项
<el-select v-model="form.stage_status" placeholder="请选择进度">
<el-option
v-for="item in stageOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
computed: {
stageOptions() {
return Object.keys(this.$dataDic.stage_status).map(item => {
return { value: item, label: this.$dataDic.stage_status[item] }
})
},
}