начальные значения из раскрывающегося списка материала-ui в сокращенной форме

Question

У меня есть раскрывающееся меню материала-ui внутри редукционной формы, и я хочу инициализировать его значение. Я получаю как значение, которое я хочу [exercise.exercise_type_id и exercise.exercise_type_name] и список доступных опций [types, массив объектов с id и name свойствами, среди других], направив два действия:

componentWillMount(){ 
    this.props.actions.exercise.fetchInfo(this.props.params.exerciseId); 
    this.props.actions.exercise.fetchAllTypes(); 
}; 

В идеале I хотел бы иметь где что-то вроде:

_.map(this.props.types, (type) =>{ 
      if (type.id == this.props.exercise.exercise_type_id){ 
       this.setState({ 
        dropDownValue: type.name 
       }); 
      } 
     }); 

, но только для начального состояния, так как мы хотим, чтобы обрабатывать изменения с handleDropDownChange.

[Конечно, я был бы признателен за что-то вроде

state = { 
    dropDownValue: {this.props.exercise.exercise_type_name} 
}; 

, но я знаю, что это анти-паттерн. Но в любом случае это не работает, реквизита по-прежнему пусто]

Мой раскрывающийся как это:.

<DropDownMenu {...exercise_type_name} //does nothing 
     value={dropDownValue} 
     onChange={onDropDownChange}> 
    {_.map(types, (type) => { 
     return <MenuItem key={type.id} value={type.name} primaryText={type.name}/>; 
    })} 

Подробнее Код:

//... 

state = { 
     dropDownValue: '' 
    }; 

//... 

handleDropDownChange = (event, index, value) => { 
     this.setState({ 
      dropDownValue: value 
     }); 
    }; 

//... 

    function mapStateToProps(state){ 
    return { 
     exercise: getExerciseInfo(state), 
     initialValues: getExerciseInfo(state), 
     request: getExRequest(state), 
     types: getExTypes(state) 
    }; 
} 

//.... 

export default reduxForm({ 
    form: 'EditExerciseForm', 
    fields: ['exercise_type_name', 'max_errors_percentage', 'min_speed'] 
}, mapStateToProps, mapDispatchToProps)(ExerciseEdit); 

Answer 1

Ах, оказалось проще чем я ожидал.

Это фиксированная моя проблема:

В DropDownMenu компоненте его значение должно быть как:

value={dropDownValue || exercise_type_name.value}