三元表达式判断多个状态的使用方法？

最新推荐文章于 2022-03-30 14:58:23 发布
最新推荐文章于 2022-03-30 14:58:23 发布
阅读量1.1k 收藏 4
点赞数 4
分类专栏： javaScript 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44237840/article/details/113260999
版权
本文介绍了在JavaScript编程中如何使用三元表达式来处理和判断多个状态的情况，特别是在设置不同状态文字颜色的例子中，通过切换四种不同颜色的CSS类（.redFont, .greenFont, .blueFont, .yellowFont）实现动态效果。这个技巧对于前端开发中的条件判断和样式设置非常实用。" 104054056,7405209,理解HTTPS：握手层与加密层详解,"['网络安全', '加密算法', 'HTTPS协议', 'TLS/SSL']
摘要由CSDN通过智能技术生成

在做项目时候遇到一个参数四种状态，后来查了一下三元的多种使用方法
如下：

<view class="check-info">账单状态: <span class="check-item" :class="{greenFont:item.status==0, blueFont:item.status==1, yellowFont:item.status==2, redFont:item.status==9}">{
   {
   item.status==0?"待确认" : (item.status
最低0.47元/天 解锁文章
summer _q
关注
  • 4
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
小程序三元参数判断
qq_38026437的博客
09-26 3079
记录一下新手容易弄混的 多次三元比较 其实就是 if else 的简写，true 就是 ←     false 就是 → 例子： css .cr{ color: red; } .cb{ color: blue; } .cy{ color: yellow; } html: &lt;view class='{{ c1 ? "cr":"cb"}}'&gt; c1有值 &lt...
微信小程序实现基于三元运算验证手机号/姓名功能示例
10-17
微信小程序使用一种简便的方式来验证用户输入的手机号码和姓名，采用了三元运算符和正则表达式进行数据校验。三元运算符是一种简洁的条件表达式，它的语法是“条件？结果1：结果2”，当条件成立时执行结果1，否则...
三元表达式多个判断条件
热门推荐
qq_38810813的博客
09-03 1万+
这是判断多个条件的写法 示例 ：0 已创建 1 审核中 2 审核通过 3 审核驳回 a == 0 ? ‘已创建’ : (a == 1 ? ‘审核中’ : (a == 2 ? ‘审核通过’ : ‘审核驳回’)) 这是判断三个条件的写法 {{item.ApplyState == "0" ? '未生成订单' : (item.ApplyState == "1" ? '已生成订单' : '已完成发货')}} ...
三元运算符、三目运算符、判断四层、判断多层
imkaifan的博客
11-03 847
<div class="index" :class="row.data.index == 01 ? 'first' : (row.data.index == 02 ? 'second':(row.data.index == 03 ? 'third':'normal'))" > {{row.data.index}} </div>
状态的进行中、未开始、已结束状态的排序
keyboard专栏
08-14 6662
if( now()< start_time, 2, if(start_time <= now() and now() <= end_time,1,0))
三元表达式判断数值是否为true，决定颜色
OnismYY的博客
11-03 1364
//如果isEnabled为true，颜色为红色，如果为false，颜色为灰色 <p color="isEnabled ? 'red' : '#ccc'">我爱你中国</p>
exo表达式条件
02-26
2. **switch语句**：当有多个可能的执行路径时，`switch`语句比多个`if...else`更简洁。它会比较一个值与一系列的`case`，如果匹配，则执行相应的代码块。例如： ```javascript let dayOfWeek = 'Monday'; switch ...
WEB开发EL表达式详解
08-18
- **EL忽略设置**：使用 `<%@page isELIgnored="true"%>` 可以控制是否启用EL表达式，默认为开启状态。 - **运算符**：EL支持多种运算符，包括算术运算符、关系运算符和逻辑运算符。 ##### 2. EL表达式的运算符 - ...
第2章 基本数据类型、运算符及表达式1
08-08
表达式是包含一个或多个运算符和操作数的组合，它们可以进行计算并返回一个值。条件表达式，如 `grade>=90 ? 'A' : (grade>=60 ? 'B' : 'C')`，是一种三元运算符，它根据`grade`的值返回'A'、'B'或'C'。 逻辑表达式...
Mule-表达式语言参考.rar_mule_mule语言
最新发布
09-23
:`（三元运算符）来执行条件判断。例如，`#[payload > 10 ? 'Greater' : 'Less or Equal']`。 7. **逻辑运算符** 包括`&&`（与），`||`（或），`!`（非）。例如，`#[payload != null && payload.length() > 0]`...
三元运算符，添加不同颜色的方式
dyx001007的博客
02-24 1363
<div v-for="(item, index) in left" :key="index"> <i :style="{'background':index===0?'red':index===1?'#ff6f19':index===2?'#ffac00':'#585757'}">{{ index + 1 }}</i> <span>{{ item }}</span> </di.
三元表达式判断多个条件
Macao7_W的博客
03-30 1803
今天在写项目的时候遇见一个现在想起来很初级的问题，一开始只以为三元表达式只能判断两种条件，后来才知道可以一直判断（只考虑了实现功能，没有考虑性能优化）。 HTML里动态绑定type： :type="scope.row.cooperationType==1?'success':scope.row.cooperationType==2?'warning':'danger'" 效果： 只需要一直往后进行判断就可以了。 ...
三元运算符 判断多个状态
欢迎小伙伴们的评论和私信，工作日基本都会上来看看的哈
09-08 2592
可能会碰到判断多个状态的时候，使用if的话，代码比较冗（rong）长，这时候三元运算符的优势就显示出来了！ 如 一个状态 有 未开始 成功 进行中 失败 四种状态，接口里分别代表 0 1 2 3 <template #runState="{ scope }" >{{ scope.row.runState == 0 ? '未开始' : scope.row.runState == 1 ? '成功' .
三元表达式多个条件判断
前端小99的博客
11-26 3815
{this.state.walkclassdetailinfo.sexType == 1 ? '均衡' : (this.state.walkclassdetailinfo.sexType==0?'--':'不均衡')} sexType=0 输出 -- sexType=1 输出 均衡 sexType=2 输出 不均衡 var a = 3; var b = a === 1 ? '是1' : (a === 2 ? '是2' : '不是1也不是2') console.log(b); //不是1也...
vue三元表达式多个判断
qq_34227291的博客
08-17 6427
<p>{{scope.row.type==0?'充值' : scope.row.type==1?'退款': scope.row.type==2?'消费':'补款'}}</p>
JS三元运算符怎样判断多个条件的方法
南北极之间
11-26 2300
<span class="subtitle"> {{ activeName == 1 ? '一' : activeName == 2 ? '二' : '三' }}级 </span>
三元表达式实现三个条件的判断
weixin_33878457的博客
12-06 3783
2019独角兽企业重金招聘Python工程师标准>>> ...
C语言中的选择结构：逻辑与关系表达式
本章重点讨论C语言中的选择结构程序设计，特别是逻辑表达式和相关运算符的使用。选择结构是程序设计的三大基本结构之一，用于根据条件执行不同的代码块。 在C语言中，逻辑表达式是由关系表达式或逻辑量通过逻辑...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值