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

}

}

相关推荐
前端粉刷匠1 分钟前
2025 年是 Agent 的,2026 年是 Harness 的——AI 编程 Harness 架构深度解析
前端·人工智能
张元清4 分钟前
React useSessionStorage Hook:刷新不丢、只属于当前标签页的状态 (2026)
前端·javascript·react.js
weixin_BYSJ19876 分钟前
flask民族服饰饰品商城小程序---附源码37399
java·javascript·spring boot·python·小程序·django·php
xiaominlaopodaren10 分钟前
three.js最小地图运行时(一):视图状态
javascript·gis·three.js
cindershade11 分钟前
为 TypeScript 项目建立可靠的类型边界:API 响应、表单与第三方库
前端
半仙er13 分钟前
第一周02天 原型与原型链
前端
半仙er14 分钟前
第一周04天Promise 深入与 async / await
前端
fail_to_code14 分钟前
从 Lighthouse 83 到 100:一次 Vue 项目的性能排查实录
前端·人工智能
用户693717500138420 分钟前
DeepSeek 调价正式生效:一夜涨 11 倍,靠低价薅羊毛的日子结束了
前端·人工智能·后端
Orange_sparkle23 分钟前
从五个 TypeScript 文件看懂 Coding Agent:一次 nano-pi 学习复盘
javascript·学习·typescript