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

相关推荐
之歆12 小时前
Day03_HTML 列表、表格、表单完整指南(上)
前端·html
yaoxin52112312 小时前
388. Java IO API - 处理事件
java·服务器·数据库
JAVA学习通12 小时前
AI 工作流编排系统的任务拆分、重试与观测:2026年工程实践深度解析
java·人工智能·spring
吴声子夜歌12 小时前
Vue3——组件基础
前端·javascript·vue.js
恋猫de小郭12 小时前
Jetpack Compose 1.11 正式版发布,下一代的全新控件和样式 API,你必须知道
android·前端·flutter
孩子 你要相信光12 小时前
前端 Canvas 导出带水印图片跨域问题
前端
凤山老林12 小时前
27-Java final 关键字
java·开发语言
少许极端12 小时前
算法奇妙屋(四十九)-贡献法
java·算法·leetcode·贡献法
卷毛的技术笔记12 小时前
从零到一:深入浅出分布式锁原理与Spring Boot实战(Redis + ZooKeeper)
java·spring boot·redis·分布式·后端·面试·java-zookeeper
zxna13 小时前
前端直连oss分片上传文件,断点续传
前端