Question

我在其中使用带有字段的Redux-Form，其中每个字段都包含自定义 dropDownList组件。我想在第二个下拉列表更新时使用formReducer.plugin清除第一个下拉列表的值，但是我无法使用它。

表单的定义如下：

<form onSubmit={someMethod}>
    <div>
        <Field
            name="input1"
            title="Input 1"
            type="text"
            component={DropDownComponent1}
        </Field>
    </div>

    <div>
        <Field
            name="input2"
            title="Input 2"
            type="text"
            component={DropDownComponent2}
        </Field>
    </div>
</form>

DropDownComponent1和DropDownComponent2是无状态的下拉列表组件，其价值在于，它们仅包含<select>标记。它们是这样的：

export const DropDownComponent1 = ({ input, meta }) => {
    return (
        <div>
            <select {...input} type="text" onChange={input.onChange}>
                <option>Option A</option>
                <option>Option B</option>
            </select>
        </div>
    );
}

export default DropDownComponent1;

我的问题是Redux-Form的formReducer正常工作正常，但是当我包含formReducer.plugin({ /* code */ })时，它停止工作。当在两个下拉列表中选择一个选项时，它甚至停止更新两个下拉列表的值。因此，这可行（在我的reducer.js中）：

export default combineReducers({
    /* ... other reducers */,
    form: formReducer
})

但这不起作用：

export default combineReducers({
        /* ... other reducers */,
        form: formReducer.plugin({
            myForm: (state, action) => {
               /* code to clear value of dropDownList1 if dropDownList2 changes */
            }
        })
    })

实际上，当我开始使用formReducer.plugin时，两个dropDownList组件的值都会在选择其选项时停止更新。

我误用了formReducer.plugin吗？

编辑：标题已编辑

Redux-form的formreducer.plugin不会更新字段

0 个答案: