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

}

}

相关推荐
年轻的砖头4 分钟前
以Ajax方式提交整个表单
前端·javascript·ajax
L-影18 分钟前
FastAPI CORS 跨域:Web 世界的“小区门禁”与“访客通行证”
前端·javascript·fastapi
stereohomology23 分钟前
已进入初赛提交Demo的两个项目:(2)单独html钢琴
前端·html·why不coding
源图客30 分钟前
Claude Code基础使用
服务器·前端·数据库
asdzx671 小时前
在 React 中轻松实现 PDF 转 Word:纯前端 WASM 方案实战
前端·react.js·pdf
daols881 小时前
vue 甘特图 vxe-gantt 实现双进度条:计划 vs 实际,支持多级子任务拆分
vue.js·甘特图·vxe-table·vxe-gantt
爱勇宝9 小时前
第 1 章:别把“需求文档”当成真正的需求
前端·后端·程序员
梨子同志10 小时前
常用命令
前端
梨子同志10 小时前
React 状态管理
前端
Dxy123931021611 小时前
MySQL索引完整教程:创建、查看、修改、删除与日常管理
前端·javascript·mysql