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

}

}

相关推荐
Highcharts.js2 小时前
如何根据派生数据创建钟形曲线图表?highcharts正态分布曲线使用指南:从创建到设置一文搞定
开发语言·javascript·开发文档·正态分布·highcharts·图表类型·钟形图
a1117762 小时前
纸张生成器(html开源)
前端·开源·html
心.c2 小时前
虚拟滚动列表
前端·javascript·vue.js·js
祯民3 小时前
《复合型 AI Agent 开发:从理论到实践》实体书上架
前端
NEXT063 小时前
深拷贝与浅拷贝的区别
前端·javascript·面试
不写八个3 小时前
PixiJS教程(一):快速搭建环境启动项目
前端·pixijs
PieroPc3 小时前
用html+css+js 写一个Docker 教程
javascript·css·docker·html
菜鸟小芯3 小时前
【GLM-5 陪练式前端新手入门】第二篇:CSS 让网页从 “能用” 变 “好看”
前端·css
We་ct4 小时前
LeetCode 112. 路径总和:两种解法详解
前端·算法·leetcode·typescript
倚肆4 小时前
WebSocket连接教程示例(Spring Boot + STOMP + SockJS + Vue)
vue.js·spring boot·websocket