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 分钟前
个人八股之三层架构
java·经验分享·后端·架构·异世界
轻口味5 分钟前
AI 时代全栈开发破局:TypeScript 生态实战,从入门到部署一站式通关
前端·mongodb·docker·ai·typescript·react·next.js
贫民窟的勇敢爷们7 分钟前
SpringBoot多环境配置全解+配置优先级管控
java·spring boot·后端
tellmewhoisi12 分钟前
单独抽取用户服务(请求不通):feign添加拦截器(添加token)
java·开发语言
ZC跨境爬虫14 分钟前
跟着MDN学HTML_day_45:(EventTarget接口)
前端·javascript·ui·html·媒体
YL2004042624 分钟前
035LRU缓存
java·leetcode·缓存
漂移的电子28 分钟前
【el-tree】外层多选,某个属性内层单选
前端·javascript·vue.js
BJ-Giser38 分钟前
Cesium 体积光阴影率分析和阴影体渲染效果
前端·可视化·cesium
不像程序员的程序媛41 分钟前
mysql 0000-00-00 00:00:00零日期问题
java·mysql
幽络源小助理42 分钟前
YK一点资讯Zblog主题源码, 游戏攻略新闻资讯模板
前端·php源码