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

}

}

相关推荐
excel38 分钟前
Nuxt 中 useSeoMeta 与 useHead 的区别
前端
竹林81843 分钟前
OmniGame 技术白皮书:从零依赖到 WebRTC P2P,重新定义网页小游戏的工程上限
前端·浏览器
ss27344 分钟前
AI全栈实战 | 2.1-02 CSS 布局:垂直居中为什么是经典面试题?所有布局在解决什么矛盾
前端·css
律宏阔1 小时前
Flutter Riverpod 3:统一打印 Provider 错误与自动重试日志
前端·flutter
周洲08301 小时前
STM32片内Flash读写深度详解|掉电参数保存、底层原理
linux·前端·stm32
data analyse 4561 小时前
埋点工具的私有化部署成本高吗?
前端·数据分析·github
data analyse 4562 小时前
埋点工具的埋点查询语言难学吗?
前端·数据分析
DianSan_ERP2 小时前
多平台订单自动下载与回传的技术实现:从消息推送到状态闭环引言
java·linux·服务器·前端·网络·架构·自动化
恋猫de小郭2 小时前
Shopify 回应为什么从 RN 回到原生,为什么不用 KMP ?
android·前端·flutter
小蜗 strong3 小时前
和电脑猜拳(随机程序应用)
服务器·前端·python