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

}

}

相关推荐
全栈老石6 分钟前
手写一个无限画布 #3:如何在Canvas 层上建立事件体系
前端·javascript·canvas
晴殇i14 分钟前
BroadcastChannel:浏览器原生跨标签页通信
前端·面试
csdn飘逸飘逸18 分钟前
Autojs基础-device(设备)
javascript
DeathGhost18 分钟前
分享URL地址到微信朋友圈没有缩略图?
前端·html
csdn飘逸飘逸19 分钟前
Autojs基础-文件系统(files)
javascript
MrBread19 分钟前
微任务链式派生阻塞渲染
前端·debug
wuhen_n21 分钟前
patch算法:新旧节点的比对与更新
前端·javascript·vue.js
小岛前端21 分钟前
Cloudflare 掀桌子了,Next.js 迎来重大变化,尤雨溪都说酷!
前端·vite·next.js
简离21 分钟前
前端调试实战:基于 chrome://webrtc-internals/ 高效排查WebRTC问题
前端·chrome·webrtc
十里八乡有名的后俊生23 分钟前
深度解析:JavaScript中的import方式 - 静态导入、动态导入与CSS处理机制
前端·javascript·面试