javascript - React Select defaultValue 已设置但未出现

问题描述

我什至尝试过手动设置文档中的默认值，但没有骰子。我不确定这是样式问题还是什么。所以下面我发布了我的截图和截图。

  <Select
        components={animatedComponents}
        getOptionLabel={convertToLabel}
        getOptionValue={option => option.resource_name}
        isMulti
        onChange={changeEvent}
        options={users}
        theme={theme => ({
          ...theme,
          borderRadius: 0
        })}
        defaultValue={(props.value || []).map(convertToValue)}
        value={(props.value || []).map(convertToValue)}
      />

convertToValue功能

  const convertToValue = props => {
    return {
      label: `${props.name} ${props.family_name}`,
      value: props.resource_name
    };
  };

转换标签函数

  const convertToLabel = props => {
    return `${props.name} ${props.family_name}`;
  };

changeEvent功能

  const changeEvent = (selectedOption, i) => {
    let option = {
      name: "reviewers",
      value: selectedOption
    };
    update({ target: option });
  };

用户和道具对象

users: 
  [
    {
      resource_name: "facebook_user1",
      name: "Joe",
      family_name: "Dirt"
    },
    {
      resource_name: "facebook_user2",
      name: "Trident",
      family_name: "White"
    }
  ]

props:
  {
    field: "placeholder",
    fieldType: "placeholderType"
    value:[
            {
              resource_name: "facebook_user1",
              name: "Joe",
              family_name: "Dirt"
            },
            {
              resource_name: "facebook_user2",
              name: "Trident",
              family_name: "White"
            }
          ]
  }

我在屏幕上看到的。

标签： javascriptreactjsreduxreact-select

如果没有看到您选择的渲染器的实际 JSX，很难准确地判断您的问题是什么。以下是我看到的一些问题，看着你的问题，以及对可能发生的事情的一些艰难猜测。

您应该向我们展示您的 Select 实现的完整 JSX 渲染
你从来没有向我们展示你的defaultValue道具是什么样子，但请记住，value它应该等于你 option的一个，而不仅仅是一个option“价值”
您的标签和选项 getter 方法签名应该是getOptionLabel = (option) => stringand getOptionValue = (option) => string。在您的实例中，您使用props了可能与父范围冲突的。
您可能希望您的convertToValue方法签名也与那些一致。
您的onChange事件方法签名与 React-Select 不一致，可能会给您带来痛苦。有关此问题的帮助，请参阅我对这个最近的问题的回答。

javascript - React Select defaultValue 已设置但未出现

问题描述

解决方案

推荐阅读