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

}

}

相关推荐
颜进强2 分钟前
20-Spec-Kit Tasks 是怎么把技术方案拆成可执行任务的?
前端·后端·ai编程
程序员鱼皮3 分钟前
Cursor 零基础实战教程,夯爆了!带你速通 6 大核心能力
前端·后端·ai编程
颜进强4 分钟前
14-Spec-Kit、SDD 和 OpenSpec 到底有什么区别?其实核心思想都一样:先写清楚,再让 AI 干活
前端·后端·ai编程
颜进强4 分钟前
16-Spec-Kit 是什么?先从整体流程机制讲起
前端·后端·ai编程
悟空瞎说7 分钟前
QML 集成 WebView 开发桌面内嵌浏览器实战
前端
八目蛛8 分钟前
八目蛛网络(免费工具网站导航)
css·vue.js·开源·vue3·html5·ai编程
Delicate14 分钟前
揭开JS深拷贝的底裤:从递归到循环引用的终极解法
javascript
前端与小赵21 分钟前
快速生成安卓证书并打包生成安卓apk(保姆教程)
android·前端
Cxiaomu27 分钟前
MentorPi A1 底盘接入开发实践:让自研Web系统接管机器人底盘
前端·机器人
创业之路&下一个五年1 小时前
mvvm中v和vm关系,vm中v和m的关系?
java·开发语言·javascript