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

}

}

相关推荐
lichenyang45313 小时前
鸿蒙电商 Demo v2:真实商品接口 + 支付/订单闭环 + 收藏功能,外加一个 ArkUI V2 @Builder 响应式断链的硬核坑
前端·后端
前端的阶梯13 小时前
如何节省你的token,请看CodeGraph
前端·人工智能·后端
万少14 小时前
产品原型不用从零画 -GPT 出图,Gemini 生成 HTML
前端·javascript·后端
逐光老顽童14 小时前
用 Go 实现一个 LLM 路由网关:Thompson Sampling 与自适应故障转移实践
vue.js·go
wuhen_n14 小时前
RAG 第一步:多格式文档加载与文本预处理实战
前端·langchain·ai编程
程序员黑豆15 小时前
全新系列开启:AI 全栈开发
前端·后端·全栈
小小小小宇15 小时前
Partial Clone
前端
小小小小宇15 小时前
git sparse-checkout(稀疏检出)
前端
ZC跨境爬虫15 小时前
跟着 MDN 学JavaScript day_9:字符串方法实战挑战与解题思路
开发语言·前端·javascript
夜焱辰15 小时前
WebMCP 的正确打开方式:只注册 2 个工具,代理 N 个——CreatorWeave 的 On-Demand 实践
前端