Реагировать на выбор, установить начальное значение с помощью Redux Form

Я пытаюсь установить начальное значение для моего тега Select, используя поле формы Redux.

Редукс Поле:

<Field
                    name = "statusDto.pkid"
                    component = {renderSelectField}
                    type = "text"
                    isHidden = "true"
                    placeholder = "Select Status"
                    options = {userRegistrationStatus && userRegistrationStatus.map((values) => { return ({ value: values.pkid, label: i18next.languages[0] === 'en' ? values.enName : values.trName }); })}
                  />

Редукционная форма:

UserRegistrationForm = reduxForm({
  validate,
  form: 'User_Registration_Form', // a unique identifier for this form
  enableReinitialize: true,
})(UserRegistrationForm));

Реагировать Выберите:

handleChangeEvent = (selectedOption) => {
    const { onChange } = this.props;
    this.setState({ selectedOptionState: selectedOption });
    onChange(selectedOption.value);
  };

 <Select
        name = {name}
        value = {selectedOptionState}
        onChange = {this.handleChangeEvent}
        styles = {customStyles}
        options = {options}
        clearable = {false}
        className = "react-select"
        placeholder = {placeholder}
        isDisabled = {isDisabled}
        classNamePrefix = "react-select"
        theme = {(theme) => ({
          ...theme,
          borderRadius: 0,
          colors: {
            ...theme.colors,
            primary: '#70bbfd',
          },
        })}
      />

Используя инициализацию избыточной формы, я пытаюсь присвоить первое значение для реакции-выбора, но, похоже, оно того не стоит. Вы можете помочь мне?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
1
0
1 411
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я решил проблему.

Реагировать Выберите:

<Select
        name = {name}
        value = {(value === '') ? null : options.find(obj => obj.value === value)}
        onChange = {this.handleChangeEvent}
        styles = {customStyles}
        options = {options}
        clearable = {false}
        className = "react-select"
        placeholder = {placeholder}
        isDisabled = {isDisabled}
        classNamePrefix = "react-select"
        theme = {(theme) => ({
          ...theme,
          borderRadius: 0,
          colors: {
            ...theme.colors,
            primary: '#70bbfd',
          },
        })}
      />

Другие вопросы по теме