switch 过滤筛选 数值转换文字值
第一种,接口调用直接返回使用
展示处
getList() { 方法名
下面调接口直接处理
fetchList(接口传值).then(response => {
this.tableData = response.data.data.records;
this.tableData.forEach(item => {
switch (parseInt(item.deviceStatus)) {
case 0:
item.deviceStatus = "正常";
break;
case 1:
item.deviceStatus = "故障";
break;
case 2:
item.deviceStatus = "维修中";
break;
case 3:
item.deviceStatus = "已报废";
break;
}
});
})
.catch(() => {错误信息展示});
},
第二种 方法调用 dom 传值
<span v-text="getdeviceType(scope.row.deviceType)"></span>
getdeviceType(val) {
switch (val) {
case "0":
return "正常";
case "1":
return "告警";
case "2":
return "故障";
case "3":
return "告警+故障";
}
},
第三种,行内 插槽三元表达式
<el-table-column prop="deviceStatus" label="状态">
<template slot-scope="scope">
{{ scope.row.deviceStatus == 1 ? "在线" : "离线" }}
</template>
</el-table-column>

浙公网安备 33010602011771号