reactjs – 用三元运算符React className添加类’null’

发布时间：2020-12-15 09:32:20 所属栏目：百科来源：网络整理

导读：我正在尝试使用如下表达式有条件地将类应用于我的组件： .map(function(list,index) { div className={"myClass " + (position === index ? 'active' : null)}} 但它不断添加null作为类,最终结果如下： div class="myClass active"...div class="myClass nul

我正在尝试使用如下表达式有条件地将类应用于我的组件：

.map(function(list,index) {
    <div className={"myClass " + (position === index ? 'active' : null)}>
}

但它不断添加null作为类,最终结果如下：

<div class="myClass active">...
<div class="myClass null">...

这是一个简单的例子,只有2个类名,所以我可以用默认的类名替换null.但是在更复杂的布局中,我需要一遍又一遍地复制相同的名称.

有没有更好的方法来解决这个问题？

解决方法

您可以使用空字符串”而不是null,如：

.map(function(list,index) {
    <div className={"myClass " + (position === index ? 'active' : '')}>
}

另外map应该返回一个值：

.map(function(list,index) {
     return <div className={"myClass " + (position === index ? 'active' : '')}>;
 }

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!