React Select defaultValue 已设置但未出现

Question

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

  <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
    };
  };

convertToLabel 函数

  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"
            }
          ]
  }  

我在屏幕上看到的。

Answer 1

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

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