我想在组件中呈现两个Redux表单Fields
。
对于那些来自服务器调用的字段,我有一些初始值。但是我不能在initialValues
中使用mapStateToProps
。
为什么?因为我的应用状态是一个实体数组,并且它在我可以访问this.entityId
的组件中,因此我可以从该数组中选择正确的实体。在mapStateToProps
中,我无权访问this
在这种情况下我该怎么办?
class ShowGroup extends Component {
constructor(props) {
super(props);
this.groupId = this.props.match.params.id;
this.state = {
loading: true,
error: null
};
}
componentDidMount() {
this.props.fetchGroup(this.groupId,
() => this.setState({loading: false}),
error => this.setState({loading:false, error: error})
);
}
render() {
let {props, state} = this;
let group = props.groups[this.groupId];
return (
<div className="show-group">
<form>
<Field
name="name"
fieldType="input"
type="text"
component={renderField}
label="Name"
validate={validateName}
/>
<Field
name="description"
fieldType="textarea"
component={renderField}
label="Name"
rows="2"
validate={validateName}
onBlur={this._updateGroupDesc}
/>
</form>
</div>
);
}
}
function mapStateToProps(state) {
return {
groups: state.groups
};
}
const mapDispatchToProps = (dispatch) => {
return {
fetchGroup: (groupId, successCallback, errorCallback) => dispatch(fetchGroup(groupId, successCallback, errorCallback))
};
};
export default connect(mapStateToProps, mapDispatchToProps)(reduxForm({
validate,
enableReinitialize: true,
form:'ShowGroup'
})(ShowGroup));
最佳答案
您可以在mapStateToProps
-ownProps
中使用第二个参数。
因此,您可以使用此功能访问组件的道具。
例如:
function mapStateToProps(state, ownProps) {
const groupId = ownProps.match.params.id;
return {
groups: state.groups,
initialValues: state.groups[groupId],
};
}
希望它会有所帮助。
关于javascript - 我不能将initialValues用于redux-form,该怎么办?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/49342345/