function mapStateToProps(state) {
let returnObject = {};
if (state && state.form) {
if (
state.form.someFormName &&
state.form.someFormName.values &&
state.form.someFormName.values.fieldNameX &&
state.form.someFormName.values.fieldNameX === "1"
) {
state.form.someFormName.values.fieldNameB =
state.form.someFormName.values.fieldNameA;
state.form.someFormName.values.fieldNameC =
state.form.someFormName.values.fieldNameD;
state.form.someFormName.values.fieldNameF =
state.form.someFormName.values.fieldNameE;
}
}
return returnObject;
}
这对于选择表单字段工作正常我只是将redux表单值复制到另一个字段,如何以高效方式执行?这是将一个表单字段复制到另一个表单字段的正确方法吗?
答案 0 :(得分:1)
您可以使用formValueSelector
连接到您的表单值,然后发送change
操作创建者以使用您的值更新任何字段。
以下是带文本框的示例(您可以将其更新为使用datePicker):
import {change, formValueSelector} from 'redux-form';
let FormName = (props) => {
const {dispatch, handleSubmit, firstValue} = props;
return <form onSubmit={handleSubmit}>
<div>
<label>First Value</label>
<Field
name='firstValue'
component='input'
type='text'
placeholder='First Value'
/>
</div>
<div>
<label>Copy value</label>
<div>
<Field
name='checkbox'
component='input'
type='checkbox'
value='checkboxValue'
onChange={(e) => {
if (e.target.checked) {
dispatch(change('formName', 'secondValue', firstValue));
}
}}
/>
</div>
</div>
<div>
<label>Second Value</label>
<Field name='secondValue' component='input' type='text'/>
</div>
<div>
<button type="submit">Submit</button>
</div>
</form>
};
const selector = formValueSelector('formName');
connect(
state => ({
firstValue: selector(state, 'firstValue'),
})
)(FormName);
答案 1 :(得分:0)
这不是像这样改变状态的首选方法(你正在改变状态)Redux 2原理,改为使用它: 如果你正在使用radio / checkbox,那么onPress of the radio / checkbox你可以复制所有字段,然后发送onChange动作。 对于Eg:
<Field
type="radio"
name="fieldNameX"
value="1"
onRadioPress={this.someMethod}
component={CustomRadioButton}
/>
someMethod() {
let formValues = Object.assign({}, this.props.formValues);
this.props.dispatch(
change("SomeForm", "fieldWantToCopy", value)
);
}