使用三元运算符控制是否映射到状态
使用三元运算符控制是否映射到状态
提问于 2020-08-17 08:25:30
我想使用一个三元运算符来控制是否在allTestTypes上映射。应该使用allTestTypes来填充DropdownSingle中的options参数
{allTestTypes.map(item => item.test_type )}
{!level ? null :
<React.Fragment>
<div>{configs[level].name}:</div>
<DropdownSingle
name={configs[level].name}
value={testType}
options={configs[level].dropdownValues}
onChange={onTestFieldUpdate}
/>
</React.Fragment>
})更新：
{!level ? setAllTestTypes.map((item => null :
<React.Fragment>
<div>{configs[level].name}:</div>
<DropdownSingle
name={configs[level].name}
value={testType}
options={configs[level].dropdownValues}
onChange={onTestFieldUpdate}
/>
</React.Fragment>
)
})错误：
更新2：
{!level ? null : setAllTestTypes.map((item) =>
<React.Fragment>
<div>{configs[level].name}:</div>
<DropdownSingle
name={configs[level].name}
value={testType}
options={item.test_type}
onChange={onTestFieldUpdate}
/>
</React.Fragment>
)})错误2：
响应：
Sazzad更新错误：
回答 4
Stack Overflow用户
发布于 2020-08-17 08:47:33
condition ? functionForMapping : oppositeCase
您可以将整个映射语句放在此处，也可以简单地将其包装在另一个函数中。
Stack Overflow用户
发布于 2020-08-17 09:02:28
如果要在映射任何数组项之前检查条件：
<div>
{
!!condition && (
array.map(item => item /* Mapping Function */)
)
}
</div>如果您希望仅映射某些项目，请使用filter：
<div>
{
array
.filter(item => !!item /* Condition */)
.map(item => item /* Mapping Function */)
}
</div>Stack Overflow用户
发布于 2020-08-17 09:08:36
您缺少一个结束的}。这个应该可以解决这个问题。
{!level ? setAllTestTypes.map((item =>
<React.Fragment>
<div>{configs[level].name}:</div>
<DropdownSingle
name={configs[level].name}
value={testType}
options={configs[level].dropdownValues}
onChange={onTestFieldUpdate}
/>
</React.Fragment>
)
}) : null
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/63443134
复制相关文章
相似问题
腾讯云开发者
