首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Mui5自动完成警告

Mui5自动完成警告
EN

Stack Overflow用户
提问于 2022-05-01 14:54:02
回答 1查看 434关注 0票数 0

我使用的材料-UI 5 AutoComplete组件,我有一个警告,我无法处理。

守则:

代码语言:javascript
复制
       <Autocomplete
          disableClearable
          options={options}
          value={{ displayName: selectedName || "" }}
          getOptionLabel={(option) => option.displayName || ""}
          onChange={onSelectChange.bind(null, selectedName)}
          isOptionEqualToValue={(option, selected) =>
             option.displayName === selected.displayName
          }
          renderOption={(props, option) => (
            <li {...props}>
              <Typography>{option.displayName}</Typography>
            </li>
          )}
         renderInput={(params) => (
            <TextField
              {...params}
              variant="outlined"
              placeholder={placeholder}
            />)}
        />

警告:

代码语言:javascript
复制
useAutocomplete.js:220 MUI: The value provided to Autocomplete is invalid.
None of the options match with `{"displayName":""}`.
You can use the `isOptionEqualToValue` prop to customize the equality test.

每个选项都是一个带有displayName字段的对象(例如:{displayName})

我看到了一些关于这件事的帖子,但没有任何帮助。我使用的是受控组件(值支柱),在第一次呈现时,selectedName是空的,所以在从列表中选择项之前,我将得到错误信息。

EN

回答 1

Stack Overflow用户

发布于 2022-05-03 09:13:27

也许应该在isOptionEqualToValue中进行检查,以检查所选值?类似的情况如下:

代码语言:javascript
复制
isOptionEqualToValue={(option, value) => {
          if (value === "" || value === option)
              return true;
      }}

实际上是为了检查displayName。

票数 -1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/72077789

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档