首页 > 解决方案 > 使用选项列表时出现未定义值错误

问题描述

您好我正在尝试从现有的数组中创建一个选项列表。这是代码:

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>
    );
});

现在,如果条件不匹配,它会给我一个未定义的值。有人可以帮我吗

标签: reactjs

解决方案


您可以使用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>
  ))

推荐阅读