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

}

}

相关推荐
西洼工作室6 分钟前
高效管理搜索历史:Vue持久化实践
前端·javascript·vue.js
广州华水科技13 分钟前
北斗形变监测传感器在水库安全中的应用及技术优势分析
前端
樱花开了几轉20 分钟前
element ui下拉框踩坑
开发语言·javascript·ui
开发者如是说36 分钟前
Compose 开发桌面程序的一些问题
前端·架构
故事不长丨37 分钟前
【Java SpringBoot+Vue 实现视频文件上传与存储】
java·javascript·spring boot·vscode·后端·vue·intellij-idea
旺代1 小时前
Token 存储与安全防护
前端
洋不写bug2 小时前
html实现简历信息填写界面
前端·html
三十_A2 小时前
【无标题】
前端·后端·node.js
excel2 小时前
Vue 编译器源码解读:transformVBindShorthand 的设计与原理
前端
Jeffrey__Lin2 小时前
解决Grid布局下el-table自适应缩小失败的问题
vue.js·elementui·html