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 小时前
【Spring】Spring Data JPA Repository 自动实现机制深度解析
java·后端·spring
MX_93591 小时前
Spring中Bean的配置(一)
java·后端·spring
2503_928411561 小时前
12.4 axios的二次封装-深拷贝
前端·javascript·vue.js
你真的可爱呀4 小时前
uniapp+vue3项目中的常见报错情况以及解决方法
前端·vue.js·uni-app
sg_knight5 小时前
Spring 框架中的 SseEmitter 使用详解
java·spring boot·后端·spring·spring cloud·sse·sseemitter
郑州光合科技余经理7 小时前
同城系统海外版:一站式多语种O2O系统源码
java·开发语言·git·mysql·uni-app·go·phpstorm
一只乔哇噻7 小时前
java后端工程师+AI大模型开发进修ing(研一版‖day60)
java·开发语言·人工智能·学习·语言模型
Dolphin_Home7 小时前
笔记:SpringBoot静态类调用Bean的2种方案(小白友好版)
java·spring boot·笔记
博客zhu虎康8 小时前
uniApp 开发
arcgis·uni-app
差点GDP8 小时前
模拟请求测试 Fake Rest API Test
前端·网络·json