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

}

}

相关推荐
学以智用5 分钟前
Vue 3 组件完全指南
前端·vue.js
重庆穿山甲7 分钟前
Java开发者的大模型入门:AgentScope Java组件全攻略(一)
前端·后端
LawrenceLan11 分钟前
36.Flutter 零基础入门(三十六):StatefulWidget 与 setState 进阶 —— 动态页面必学
开发语言·前端·flutter·dart
ego.iblacat12 分钟前
Web 技术与 Nginx 网站环境部署
运维·前端·nginx
ricky_fan13 分钟前
(已解决)安装openclaw龙虾[特殊字符]npm权限问题EACCES
前端·npm·node.js
TE-茶叶蛋13 分钟前
小程序协同编辑实战:从 Yjs 到纯 JavaScript 的重构之路
javascript·小程序·重构
专业流量卡14 分钟前
让小龙虾给我写文章
前端
技术人生黄勇16 分钟前
微信接入|企业微信官方插件支持 OpenClaw 3步快速接入(实操版)
java·前端·人工智能·微信·企业微信
....49216 分钟前
修复 Element Plus (Vue3) 输入框获取焦点时边框消失的问题
javascript·vue.js·ecmascript
倔强的石头_18 分钟前
MySQL 兼容性深度解析:从内核级优化到“零修改”迁移工程实践
前端·数据库