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

相关推荐
OtIo TALL9 小时前
redis7 for windows的安装教程
java
uNke DEPH10 小时前
Spring Boot的项目结构
java·spring boot·后端
xixingzhe210 小时前
idea启动vue项目
java·vue.js·intellij-idea
超级无敌暴龙兽10 小时前
和我一起刷面试题呀
前端·面试
wzl2026121310 小时前
企业微信定时群发技术实现与实操指南(原生接口+工具落地)
java·运维·前端·企业微信
小码哥_常10 小时前
Robots.txt:互联网爬虫世界的“隐形规则”
前端
凌波粒10 小时前
Java 8 “新”特性详解:Lambda、函数式接口、Stream、Optional 与方法引用
java·开发语言·idea
曹牧10 小时前
Eclipse:悬停提示(Hover)
java·ide·eclipse
小码哥_常10 小时前
Android开发神器:AndroidAutoSize,轻松搞定屏幕适配
前端
前端一小卒11 小时前
前端工程师的全栈焦虑,我用 60 天治好了
前端·javascript·后端