【问题标题】:MUI: The value provided to Autocomplete is invalid. None of the options match with `""`MUI:提供给自动完成的值无效。没有一个选项与 `""` 匹配
【发布时间】:2022-07-20 23:24:43
【问题描述】:

当在自动完成组件的输入中输入值时,我会收到无法删除的警告... 这就是我的输入的样子

 <Autocomplete
            id="cboAdresse"
            sx={{ width: 100 + "%", fontFamily: "Poppins Bold" }}
            getOptionLabel={(option) =>
              typeof option === "string" ? option : option.label
            }
            filterOptions={(x) => {
              return x;
            }}
            options={lstadresse}
            isOptionEqualToValue={(option, value) =>
              value.label === option.label
            }
            autoComplete
            includeInputInList
            filterSelectedOptions
            value={adresse}
            noOptionsText="Aucune adresse trouvée"
            onChange={(event, newValue) => {
              setLstAdresse(
                newValue.name ? [newValue.name, ...lstadresse] : lstadresse
              );
              setAdresse(newValue.name);
              if (newValue.name != "") {
                setVille(newValue.city);
                setCodePostal(newValue.postcode);
              }
            }}
            onInputChange={(event, newInputValue) => {
              setInputRue(newInputValue);
            }}
            renderInput={(params) => (
              <div
                ref={params.InputProps.ref}
                className="login-block__input form_input_white"
              >
                <input
                  type="text"
                  name="adresse"
                  placeholder="Adresse"
                  {...params.inputProps}
                />
              </div>
            )}
      />

我们可以看到我已经集成了 IsOptionEqualToValue 参数而没有解决问题。在我的研究过程中,其他人也遇到了这个问题,并用我用 IsOptionEqualToValue 编写的内容解决了这个问题。如果有人有解决方案,我很感兴趣。提前致谢。

【问题讨论】:

    标签: javascript reactjs material-ui autocomplete


    【解决方案1】:

    在 mui v5 中使用这个

    isOptionEqualToValue={(option, value) => option.value === value.value}
    

    【讨论】:

      猜你喜欢
      • 2020-02-20
      • 1970-01-01
      • 1970-01-01
      • 2022-06-17
      • 2021-11-29
      • 2022-11-30
      • 2021-09-13
      • 2021-01-18
      • 1970-01-01
      相关资源
      最近更新 更多