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

}

}

相关推荐
fxshy2 分钟前
Vue 组件中 padding 生效了,但竖线还是贴到底边的问题
javascript·vue.js·ecmascript
ayqy贾杰2 分钟前
有AI了,我当超大头兵还苟得住吗?
前端·后端·架构
Aotman_6 分钟前
JavaScript数组对象中指定字段转换
java·开发语言·前端·javascript·vue.js·前端框架·es6
姓蔡小朋友12 分钟前
React基础
前端·react.js·前端框架
IT_陈寒28 分钟前
Vue的动态组件坑了我整整一天!
前端·人工智能·后端
恋猫de小郭30 分钟前
Flutter 最好的 AI 自动化测试工具:Patrol
android·前端·flutter
Cobyte31 分钟前
AI 的个人便签纸:Claude Code 的 TodoWrite 模式
前端·后端·aigc
森叶34 分钟前
一线法编程理念
javascript
风兮雨露39 分钟前
Java 从入门到精通,前端资料
java·开发语言·前端
ZC跨境爬虫44 分钟前
跟着 MDN 学CSS day_43:CSS布局挑战——从浮动到弹性盒与栅格的综合实践
前端·css·ui·html·tensorflow