reactjs - 使用选项列表时出现未定义值错误
问题描述
您好我正在尝试从现有的数组中创建一个选项列表。这是代码:
const channelOptions = res.data.data.deliverables.map((item, index) => {
if (!item.deliverableCosts.length)
return (
<option value={item.slug} key={index} channel={item.channel.slug}>
{item.name + "(" + item.channel.name + ")"}
</option>
);
});
现在,如果条件不匹配,它会给我一个未定义的值。有人可以帮我吗
解决方案
您可以使用Array.prototype.filter
过滤没有可交付成本的项目,然后映射过滤的数组以创建选项。
const channelOptions = res.data.data.deliverables
.filter((item) => !item.deliverableCosts.length)
.map((item, index) => (
<option value={item.slug} key={index} channel={item.channel.slug}>
{item.name + '(' + item.channel.name + ')'}
</option>
))
推荐阅读
- swiftui - 创建一个输入数组的数组 swiftUI
- python - PUT API 中的 Django Rest Framework 解析错误
- c# - 具有 wpf 视图的类库的 2 个视图(相同实例)的 1 个 ViewModel
- amazon-web-services - 使用 aws 的物联网设备实时监控仪表板
- python - 如何将 YAML 文本中的元素映射到它们在该文本中的位置?
- c++ - 极端情况没有通过加权统一字符串问题
- kubernetes - HPA 计算与 CPU 和内存利用率不匹配
- java - 如何将加载的数据从 Firebase Cloud Firestore 保存到 Arraylist
- ruby-on-rails - 对“Mongoid::Criteria”的迭代执行次数少于预期
- arrays - 我需要帮助来创建一个程序,该程序可以接受用户想要的任意数量的输入