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

}

}

相关推荐
甲维斯23 分钟前
Kimi版超级玛丽效果“惊人”,配额不足5厘米!
前端·人工智能
hboot29 分钟前
AI工程师第一课 - Python
前端·后端·python
凉菜凉凉30 分钟前
AI时代,被抛弃的前端
前端·ai
console.log('npc')1 小时前
AI前端工程与生成式UI学习路线
前端·人工智能·ui
huangdong_1 小时前
淘宝商品SKU图自动分类技术深度解析:从DOM解析到智能归档
开发语言·javascript·ecmascript
梦曦i1 小时前
uni-router v1.1.1发布:守卫超时保护+路由监听
前端·uni-app
qq_2518364571 小时前
基于java Web网络订餐系统设计与实现 源码文档
java·开发语言·前端
飞天狗1112 小时前
零基础JavaWeb入门——第2课:让网页“活”起来 —— JSP是什么?
java·开发语言·前端·后端·web
回忆2012初秋3 小时前
【Nginx】优雅地走进高性能 Web 服务器世界(1)
服务器·前端·nginx