uniapp三元表达式判断状态更改字体颜色?

html

html 复制代码
<template>
  <view>
    <text :style="getStatusColor(status)">状态: {{ status }}</text>
  </view>
</template>

script

javascript 复制代码
<script>
export default {
  data() {
    return {
      status: 1
    };
  },
  methods: {
    getStatusColor(status) {
      // 根据状态值返回不同的样式对象
      return {
        color: status === 1 ? 'blue' : 'black'
      };
    }
  }
};
</script>

总结:

在上面的示例中,我们使用:style指令来动态设置文本的样式,通过调用 getStatusColor 方法来返回不同的样式对象。

getStatusColor 方法中使用了三元表达式来判断状态是否等于1。如果状态等于1,则设置 color'blue';否则,设置 color'black'

通过这种方式,当状态等于1时,文本的字体颜色将变为蓝色

相关推荐
Mike_jia6 分钟前
🎓 OpenMAIC 终极指南:清华开源的多智能体 AI 互动课堂平台
前端
踩着两条虫10 分钟前
告别低代码“黑盒”!VTJ.PRO 2.0:用AI与自由重塑Vue3开发
前端·低代码·ai编程
OpenTiny社区16 分钟前
WebAgent :基于 MCP 协议打造的智能应用“超级路由器”
前端·agent·mcp
wertyuytrewm30 分钟前
Java面试——Java基础
java·jvm·面试
czlczl2002092533 分钟前
RAG实现思路流程
java·jvm
带娃的IT创业者34 分钟前
WeClaw_40_系统监控与日志体系:多层次日志架构与Trace追踪
java·开发语言·python·架构·系统监控·日志系统·链路追踪
Y0011123636 分钟前
JDBC原理
java·开发语言·数据库·jdbc
dweizhao41 分钟前
别再用 Figma 画线框图了,Google 这款免费工具直接出 UI 稿
前端
han_1 小时前
JavaScript设计模式(五):装饰者模式实现与应用
前端·javascript·设计模式
程序员侠客行1 小时前
Tomcat 从陌生到熟悉
java·tomcat·web