React-多个className的三元表达式写法

116 阅读1分钟
1、举例

实现多个className中,里面有一个固定classNamemedal_name和一个动态classNamenoMedal_name(用三元表达式判断是否显示该类名)。

2、代码 ⭐️

~ 写法共有三种,下面是其中一种,另外两种在文章末进行补充,请往下看哟~☺️

<div className={'medal_name' + ' ' + (!item.getMedal?'noMedal_name': '')}>勋章名称</div>
3、代码解析

!item.getMedal?'noMedal_name': ''的意思是:如果不存在item.getMedal,就显示类名noMedal_name;否则,不显示。

image.png

image.png

image.png