首页 > 解决方案 > React-Select 未在第一次更改时更新

问题描述

我一直在尝试react-select在我的内部使用组件react-json-schema-form,并且选择字段第一次没有更新。这是我得到的行为。 行为视频

编码:

    const CustomSelect = function (props) {
        return (
          <Select
            id="input"
            className="basic-single"
            classNamePrefix="select"
            options={props.options.enumOptions}
            placeholder={props.label}
            isSearchable={true}
            onChange={(e) => {
              props.onChange(e.value);
              if(props.schema.title === "WiFi model"){
                console.log(e.value)
              }
            }}
          ></Select>
        );

  };

道具来自 RJSF, enumOptions 看起来像:

[{label: "3Com", value: "3Com"}
 {label: "4G Systems", value: "4G Systems"}
 {label: "7Links", value: "7Links"}
 {label: "8devices", value: "8devices"}
 {label: "ADB", value: "ADB"}
 {label: "ADI Engineering", value: "ADI Engineering"}
 {label: "ADSLR", value: "ADSLR"}
 {label: "ALFA Network", value: "ALFA Network"}]

谁能告诉我我做错了什么?

父 RJSF:

<Form
        schema={schema}
        widgets={widgets}
        onSubmit={onSubmit}
        formData={formData}
      />  

那是父组件,我使用 react-select 作为自定义组件!

  const widgets = {
    SelectWidget: CustomSelect,
  };

供参考: https ://react-jsonschema-form.readthedocs.io/en/latest/advanced-customization/custom-widgets-fields/

标签: javascriptreactjsreact-selectreact-jsonschema-forms

解决方案


推荐阅读