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时,文本的字体颜色将变为蓝色

相关推荐
Jackson__5 分钟前
AI Agent 的能力从哪里来?一文讲清后训练、上下文学习和外部能力
前端·agent·ai编程
RainCity5 分钟前
Java Swing 自定义组件库分享(十五)
java·笔记·后端
farerboy10 分钟前
23-Java 构造函数
java·后端
默_笙12 分钟前
🎉 AI 项目里为什么需要 BFF?因为我实在不想在前端处理二进制流
前端·javascript
Revolution6112 分钟前
改一个订单筛选,为什么要在六个目录里来回找,前端项目目录到底要怎么拆
前端·前端工程化
坚持的小马20 分钟前
Rocketmq搭建操作步骤
java·rocketmq·java-rocketmq
阳光是sunny25 分钟前
LangGraph高级教程:Multi Schema多状态管理详解
前端·人工智能·后端
砚底藏山河36 分钟前
多家股票数据接口对比、企业级股票数据API
java·python·金融·maven
VX_bysjlw9851 小时前
基于微信小程序的宠物用品商城系统-后端74346-计算机毕设原创(免费领源码+带部署教程)
java·redis·微信小程序·eclipse·mybatis·idea·微信开发者工具
JAVA面经实录9172 小时前
图解23种设计模式完整知识体系(Java后端面试完整版)
java·架构