时间戳

首页 > 解决方案 > Material-UI 自动完成警告：使用 `getOptionSelected` 属性自定义相等测试

javascript - Material-UI 自动完成警告：使用 `getOptionSelected` 属性自定义相等测试

问题描述

我正在使用带有动态创建选项的自动完成文本字段多个值。问题是我总是收到错误“没有任何选项与["prova1","prova2","prova3"]您可以使用getOptionSelected道具来自定义相等测试”。我错过了什么？

这是代码：

const top100Films = [ 'prova1','prova2','prova3' ];

const [tags, setTags] = useState([top100Films[0], top100Films[1]]);

<Autocomplete
        multiple
        id="tags-outlined"
        noOptionsText={'Nessuna opzione'}
        options={top100Films}
        onChange={(event, value) => setTags(value)}
        getOptionSelected={(option, value) => option === value.value}
        getOptionLabel={(option) => option}
        defaultValue={[top100Films[0], top100Films[1]]}
        filterOptions={(options, params) => {
          const opt = options.filter(r => tags.filter(x => x === r ).length === 0)
          const filtered = filter(opt, params);
          // Suggest the creation of a new value
          if (params.inputValue !== '' && tags.filter(x => x === params.inputValue).length === 0) {
            filtered.push(params.inputValue)
          }
          return filtered
        }}
        renderInput={(params) => (
          <TextField
            {...params}
            variant="outlined"
            label="Tag"
            placeholder="Inserisci tag"
          />
        )}
      />

标签： javascriptreactjsmaterial-ui

解决方案

https://next.material-ui.com/guides/migration-v4/

在 MUI 版本 5 中，getOptionSelected 已重命名为 isOptionEqualToValue

推荐阅读