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

相关推荐
一灯架构3 小时前
90%的人答错!一文带你彻底搞懂ArrayList
java·后端
小李子呢02113 小时前
前端八股CSS(2)---动画的实现方式
前端·javascript
Y4090014 小时前
【多线程】线程安全(1)
java·开发语言·jvm
布局呆星4 小时前
SpringBoot 基础入门
java·spring boot·spring
风吹迎面入袖凉5 小时前
【Redis】Redisson的可重入锁原理
java·redis
w6100104665 小时前
cka-2026-ConfigMap
java·linux·cka·configmap
GreenTea5 小时前
从 Claw-Code 看 AI 驱动的大型项目开发:2 人 + 10 个自治 Agent 如何产出 48K 行 Rust 代码
前端·人工智能·后端
语戚5 小时前
力扣 968. 监控二叉树 —— 贪心 & 树形 DP 双解法递归 + 非递归全解(Java 实现)
java·算法·leetcode·贪心算法·动态规划·力扣·