我有以下关于选择组件的问题，该组件是动态的，并过滤选定的值，因此用户不能使用相同的值两次，但在当前实现时，我得到了超出范围的值，希望我添加特定的值，是什么导致了这个问题，以及如何防止显示错误？

const groupsOptions = ['a','b','c','d','e','f']
 const addedValue = // this will give already existing value that have been already added 
 const currentOptions = [...groupsOptions].filter((el) => !addedValue?.includes(el));
 
 <FormControl>
  <Select value={currentValue} onChange={handleChange}>
    <MenuItem value='' >
      <Typography>
       Values
      </Typography>
    </MenuItem>
    {currentOptions.map((el, i) => (
      <MenuItem key={i} value={el}>{el}</MenuItem>
    ))}
  </Select>
</FormControl>

错误消息为
材料-UI：您为选取元件提供的值a超出范围。请考虑提供符合其中一个可用选项或''的值。可用的值为''、b、c、d、e、g。