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

相关推荐
wangkay884 小时前
【Java 转运营】Day02:抖音直播间流量底层逻辑全解析
java·新媒体运营
5***b974 小时前
Spring Boot--@PathVariable、@RequestParam、@RequestBody
java·spring boot·后端
bug总结4 小时前
身份证号脱敏的正确实现
前端·javascript·vue.js
AIGCExplore5 小时前
Jenkins 全局配置及工具验证教程
java·servlet·jenkins
qq_318121595 小时前
Java大厂面试故事:Spring Boot、微服务与AI场景深度解析
java·spring boot·redis·微服务·ai·kafka·spring security
林太白5 小时前
Vite8 Beta来了,Rolldown携手Oxc
前端·javascript·后端
xkxnq5 小时前
第二阶段:Vue 组件化开发(第 19天)
前端·javascript·vue.js
玛丽莲茼蒿5 小时前
javaSE 集合框架(五)——java 8新品Stream类
java·开发语言
程序员小假5 小时前
设计一个支持万人同时抢购商品的秒杀系统?
java·后端
L***d6705 小时前
Spring Boot(七):Swagger 接口文档
java·spring boot·后端