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 '已送达'

}

}

相关推荐
我是伪码农10 分钟前
HTML和CSS复习
前端·css·html
林恒smileZAZ12 分钟前
前端实现进度条
前端
前端老石人15 分钟前
邂逅前端开发:从基础到实践的全景指南
开发语言·前端·html
阿珊和她的猫24 分钟前
以用户为中心的前端性能指标解析
前端·javascript·css
木心术124 分钟前
OpenClaw网页前端开发与优化全流程指南
前端·人工智能
Amumu1213825 分钟前
HTML5的新特性
前端·html·html5
SeSs IZED31 分钟前
【Nginx 】Nginx 部署前端 vue 项目
前端·vue.js·nginx
叫我一声阿雷吧40 分钟前
JS 入门通关手册(36):变量提升、暂时性死区与块级作用域
javascript·变量提升·暂时性死区·tdz·块级作用域· 前端面试
成都渲染101云渲染666643 分钟前
跳出“硬件堆砌”陷阱|渲染101如何用技术重构云渲染的专业价值?
java·前端·javascript
快乐点吧1 小时前
【前端】前端开发中如何高效利用 curl 工具
前端·状态模式