javascript - 自定义选择 react ，过滤列表

Question

我正在制作自定义下拉菜单 https://codesandbox.io/s/elated-driscoll-cjkcj 。我希望当用户从下拉列表中选择元素时不要再次在列表中显示该项目。 这是我第一次点击选择时的样子

然后，当我选择该项目并再次打开下拉列表时，该元素会显示在列表中

我想将其从该列表中删除，不再显示它。检查https://codesandbox.io/s/elated-driscoll-cjkcj完整代码

 <DropdownContentUI isOpen={isOpen}>
        {arrayOfSvg.map((item, idx) => {
          const { svg } = item;
          return (
             <DropdownArrowsWrapperUI key={idx} onClick={() => SelectIcon(idx)}>
              {svg}
            </DropdownArrowsWrapperUI>
          );
        })}
      </DropdownContentUI>

Answer 1

<DropdownContentUI isOpen={isOpen}>
    {arrayOfSvg.map((item, idx) => {
      const { svg } = item;
      if(isSelected != idx){
        return (
          <DropdownArrowsWrapperUI key={idx} onClick={() => SelectIcon(idx)}>
            {svg}
          </DropdownArrowsWrapperUI>
        );
      }
    })}
  </DropdownContentUI>