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

相关推荐
lichenyang453几秒前
HarmonyOS HMRouter 路由库 Demo 练习总结:从路由配置到商品管理增删改查
前端
李剑一3 分钟前
520了,程序员就得有点儿独特的浪漫
前端·three.js
me8324 分钟前
【AI】踩坑LangChain4j集成千问模型:版本适配问题完整解决历程
java·spring·阿里云·ai
initialD大辉4 分钟前
打破 3D 开发壁垒:一个低代码/零代码数字孪生平台的前后端全栈架构演进
前端·数据可视化
VOLUN8 分钟前
🚀 Vue3 + Element Plus 实战:封装一个“可配置列 + 拖拽 + 固定 + 全屏”的 TableSetting 组件
前端
前端小蜗18 分钟前
转生到 AI 时代,我不再相信一键生成代码的传说
前端·人工智能·架构
文心快码BaiduComate21 分钟前
520,Comate Mission模式跨越界限,和你达成最「深」联动
前端·数据库·后端
来恩100321 分钟前
Java Web三大作用域对象
java·开发语言·前端
ゆづき28 分钟前
Java 初学者入门指南:常见问题 + 核心知识点 + 进阶 20 道练习题
java·开发语言·学习·算法·水题
_Evan_Yao34 分钟前
限流的艺术:令牌桶与滑动窗口的博弈,以及我为何在 AI 项目中选择了后者
java·后端·架构