react自定义下拉组件中未显示道具

Question

我面临着一个愚蠢的问题，默认值没有在表单中呈现。在我的应用程序中，当用户登录时，一个表单将自动填充一些细节，因为它将从存储的用户信息中提取数据，这些信息通过道具传递给我的组件。

但是，myValue常量有效，defaultValue不行。是的，我的组件用于多个其他组件，并且工作得非常好。它基本上是从'react'呈现''。

我需要什么来修复这个？

renderGender() {
    const { options, data } = this.props;
    const gender = get(data, 'gender');
    const defaultValue = gender ? capitalize(gender) : gender;
    const fieldName = 'gender';
    return this.renderGenderDropDown(fieldName, defaultValue, prefixOptions);
}

renderGenderDropDown(fieldName, defaultValue, options) {
    const { configuration, id, validations } = this.props;
    const myValue = 'Male';
    return  <AppDropDown
      label={getLabel(fieldName, configuration, validations, 'gender')}
      options={dropdownOptions}
      defaultValue={myValue}
      //defaultValue={defaultValue}
      key={fieldName}
      className={fieldName}
      disabled={false}
      id={id}
      onChange={this.onGenderChange(this[fieldName])}
    />
}

Answer 1

在Javascript中，没有本地的capitalize()。这可能是返回undefined而不是字符串。试着用这个方法大写字符串中的第一个字母。

gender.charat(0).touppercase()+gender.substr(1)