我正在从服务器获取自动完成选项，它完美地获取，并且它显示了已经从API中选择的选项，但我面临的错误是，每当我尝试删除或删除一个芯片标签时，它不会删除或添加，它会给我这个警告：
MUI：提供给自动完成的值无效。没有一个选项与["jkflnbr.efb","kj.sfbalkdfb"]匹配。您可以使用isOptionEqualToValue属性自定义相等性测试。

自动补全组件代码如下：

export default function SelectPostsCatsOptions({
  selectedCategories,
  setSelectedCategories,
  onChange,
  value
}) {
  console.log("cats are:", Categories);

  return (
    <div>
      <Autocomplete
        id="Categories"
        disablePortal
        multiple
        getOptionLabel={(Categories) => `${Categories.catName}`}
        options={Categories}
        disableGutters
        isOptionEqualToValue={(option, value) =>
          option.catName === value.catName
        }
        renderOption={(props, Categories) => (
          <li {...props} key={Categories.id}>
            {Categories.catName}
          </li>
        )}
        // THE TAGS SELECTED
        renderTags={(value, getTagProps) =>
          value.map((option, index) => (
            <Chip
              key={option.id}
              label={option.catName}
              {...getTagProps({ index })}
            />
          ))
        }
        // END OF THE TAGS SELECTED
        renderInput={(params) => (
          <TextField {...params} placeholder="Categories" />
        )}
        value={value}
        onChange={onChange}
      />
    </div>
  );
}

为了更好地了解这个问题，我做了这个sandbox，请看看它。
我试图在这里做的是编辑（添加或删除所选选项）在自动完成，并重新提交它再次没有任何问题。