Reactjs 选项选择中的可选字段

嘿，伙计们，我正试图与redux表单合作创建一个自动建议。我正在使用可创建的方法。我通过外部API加载我的选项。问题是，每个选项对象中都需要一个额外的字段<代码>{值：”test@gmx.de，标签：test@gmx.de，dn:“CN…”}。有可能这样做吗？

我通常会在API请求的回调中添加我自己的属性，然后在状态中设置选项。例如

    axios.get('/some/api/request')
    .then(response => {

        const options = response.data.map(item => {
            // Add whatever custom properties you want here
            return ({value: "test@gmx.de", label: "test@gmx.de", dn:"CN...." })
    }) 

    // set your options in the state to the new options constant from above
    dispatch(change('formName', 'options', options))

希望这有帮助

//使用任一选定选项处理更改
//Handle change with either selectedOption
  handleChange(selectedOption){
    this.setState({ selectedOption })
    if(this.props.onOptionSelect){
      this.props.onOptionSelect(selectedOption.data)
    }
  }

  loadOptions(input, callback) {
    this.props.loadOptions(input).then(options => {
      callback(null, {options: options})
    })
  }

  render() {
    const {selectedOption} = this.state
    const selectClass = this.props.meta.touched && this.props.meta.error ? "has-error form-group" : "form-group"
    return (
      <div className={selectClass}>
        <AsyncCreatable
          value={selectedOption}
          onChange={this.handleChange}
          loadOptions={this.loadOptions}
          isLoading={false}
          placeholder={this.props.label}
          promptTextCreator={(label) => this.props.promtLabel(label)}
          onBlur={() => this.props.input.onBlur(selectedOption.value || "")}
        />
      </div>
    )
  }


//Function to convert incomming users in usable options (React Select)
export const convertADUsersToOptions = users => {
  return users.map(user => {
    return {
      value: normalizeDN(user.dn),
      label: user.mail
    }
  })
}

handleChange（已选择选项）{
this.setState（{selectedOption}）
if（this.props.onOptionSelect）{
this.props.onOptionSelect（selectedOption.data）
}
}
加载选项（输入、回调）{
this.props.loadOptions（输入）。然后（选项=>{
回调（空，{options:options}）
})
}
render（）{
const{selectedOption}=this.state
const selectClass=this.props.meta.toucted&&this.props.meta.error？“有错误表单组”：“表单组”
返回(
this.props.promtLabel（标签）}
onBlur={（）=>this.props.input.onBlur（selectedOption.value | | |“”）}
/>
)
}
//在可用选项中转换输入用户的函数（React Select）
export const convertADUsersToOptions=用户=>{
返回users.map（user=>{
返回{
值：normalizeDN（user.dn），
标签：user.mail
}
})
}

这也是我的第一个想法。不幸的是，React Select似乎无法处理这种选项结构。我看到了一个奇怪的景象。也许我的逻辑有问题。就像我说的，我使用React-Select-createable。我通过loadOption属性和回调函数加载选项。我没有通过redux表单获得我的选项。