2.若依vue表格数据根据不同状态显示不同颜色style

例如国标显示蓝色,超标是红色
使用是蓝色,未使用是绿色

<el-table-column label="外卖配送是否完成评价" align="center" prop="isOverFlag">

<template slot-scope="scope">

<div :style="{'color':scope.row.isOverFlag==='0'?'#ff4949':'#1ab394'}">

{{switchFormat(scope.row.isOverFlag)}}

</div>

</template>

</el-table-column>

记得在后面的methods: {中加上

switchFormat(v) {

if (v === 0 || v === '0') {

return '未完成'

} else if (v === 1 || v === '1') {

return '已送达'

}

}

相关推荐
苦学编程的谢12 分钟前
计算机是如何工作的
服务器·前端·javascript
蓉妹妹26 分钟前
React+Taro选择日期组件封装
前端·react.js·前端框架
风口上的吱吱鼠30 分钟前
记录 ubuntu 安装中文语言出现 software database is broken
linux·服务器·前端
whltaoin37 分钟前
前端弹性布局:用Flexbox构建现代网页的魔法指南
前端·弹性布局
GISer_Jing2 小时前
前端工程化和性能优化问题详解
前端·性能优化
学渣y2 小时前
React文档-State数据扁平化
前端·javascript·react.js
njsgcs2 小时前
画立方体软件开发笔记 js three 投影 参数建模 旋转相机 @tarikjabiri/dxf导出dxf
前端·javascript·笔记
一口一个橘子2 小时前
[ctfshow web入门] web71
前端·web安全·网络安全
逊嘘2 小时前
【Web前端开发】HTML基础
前端·html
Kay_Liang3 小时前
深入解析JavaScript变量作用域:var、let、const全攻略
开发语言·javascript·const·var