我在redux-form字段中使用material-ui selectField组件。如果表格是空白的(创建一家新医院),那就完美了。我可以提交并保存,一切都很好。但是,如果我包含initialValues(编辑和现有医院),它们显示正常,我可以编辑下拉值,但是当我提交表单时,值是未定义的。
我的素材-UI组件:
export class RenderSelectField extends Component {
constructor(props) {
super(props);
this.state = {
value: null,
};
}
render() {
const { initialValue, input, label, options, meta: { touched, error }, children } = this.props;
return (
<MuiThemeProvider muiTheme={getMuiTheme()}>
<SelectField
{...input}
floatingLabelText={label}
errorText={touched && error}
onChange={(event, index, value) => input.onChange(value, this.setState({ value }))}
children={children}
maxHeight={400}
autoWidth
value={this.state.value || initialValue}
>
{options.map((option) => <MenuItem value={option.id} key={option.id} primaryText={`${option.first} ${option.last}`} />)}
</SelectField>
</MuiThemeProvider>
);
}
}
我的Redux表单字段:
<Field
component={RenderSelectField}
name="regional_director"
label="Regional director"
options={this.props.contacts}
initialValue={regional_director.id}
/>
感谢您提供的任何帮助。