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

相关推荐
心灵宝贝1 分钟前
Mac 安装 JDK 8u281(JDK-8u281-1.dmg)详细步骤(附安装包)
java·macos·intellij-idea
記億揺晃着的那天2 分钟前
从单体到微服务:如何拆分
java·微服务·ddd·devops·系统拆分
7ioik1 小时前
什么是线程池?线程池的作用?线程池的四种创建方法?
java·开发语言·spring
切糕师学AI1 小时前
Lombok 注解 @Slf4j
java·lombok
寻星探路1 小时前
JavaSE重点总结后篇
java·开发语言·算法
EAIReport1 小时前
自动化报告生成产品内嵌OA/BI平台:解决传统报告痛点的技术方案
java·jvm·自动化
じòぴé南冸じょうげん2 小时前
若依框架favicon.ico缓存更新问题解决方案:本地生效但线上未更新
前端·javascript·前端框架·html
狮子座的男孩2 小时前
js基础高级:01、数据类型(typeof、instanceof、===的使用)、数据与变量与内存(定义、赋值与内存关系、引用变量赋值、js调函数传参)
前端·javascript·经验分享·数据类型·数据与变量与内存·赋值与内存关系·引用变量赋值
Cyclo-5 小时前
PDFJS 在React中的引入 使用组件打开文件流PDF
前端·react.js·pdf
向着光芒的女孩7 小时前
【IDEA】关不了的Proxy Authentication弹框探索过程
java·ide·intellij-idea