在dicts中引入字典表
dicts: [ 'archive_material', 'service_status'],
在created中定义方法
在data中定义一个全局变量 archiveMater
this.getDicts("archive_material").then(response => {
this.archiveMater = response.data;
});
在methods中定义一个方法
archiveMaterDict(val) {
if (val) { // 首先判断val不为空的情况下
if (val.indexOf(",") != -1) { // 根据,进行查找找到了为-1
var idx = val.split(",").filter(item => item != '');//使用一个变量接收用,分割之后的数组
var v = ""; // 定义一个空的字符串
for (var i = 0; i < idx.length; i++) { // 将接收到分割之后的数组进行循环
var a = idx[i]; // 定义一个变量接收循环之后数组的值
var idxv = this.archiveMater.findIndex(item => item.dictValue == a) // 根据字典表中的值去寻找后台给你的字典值如果相等返回-1
if (idxv != -1) {
if ( i == 0) {
v += this.archiveMater[idxv].dictLabel // 如果只有一个或者没有的情况下 不加逗号
} else {
console.log("这个是几" +i + ":",idxv)
v += "," + this.archiveMater[idxv].dictLabel // 将字典表值进行返回 同时拼一个,号
}
}
}
return v; // 最后将v返回
}
}
var idx = this.archiveMater.findIndex(item => item.dictValue == val)
if (idx != -1) {
return this.archiveMater[idx].dictLabel
} else {
return ''
}
},
单个字典值反写
data定义全局变量
booleanYes: [],
cerated里面写方法
this.getDicts("boolean_yes_no").then(response => {
this.booleanYes = response.data;
});
methods里面写方法
booleanYesDict(val) {
var idx = this.booleanYes.findIndex(item => item.dictValue == val)
if (idx != -1) {
return this.booleanYes[idx].dictLabel
} else {
return ''
}
},
在表格里调用
{{ booleanYesDict(form.gpError) }}
第二种方法(简单)
<template slot-scope="{row}">
<dict-tag :options="dict.type.slh_device_type" :value="row.deviceType"/>
</template>