我正在尝试创建多个具有可靠下拉列表的表单。根据下拉列表 1 上的选择,将显示一些字段并填充另一个下拉列表。
为了实现多个表单,我必须传递一个唯一的表单键,例如:
panels.map(panel =>
<PanelForm key={panel.uuid} form={`PanelForm_${panel.uuid}`} />
)
但是,要连接到状态以进行更改,我必须使用 redux formValueSelector,它需要将其设置为传递的表单名称,这是动态的,我不知道如何在此处传递它......
const selector = formValueSelector('PanelForm_XXXX')
^^^^^^^^^^^^^^
const FormConnectDecorator = connect((state) => {
const category = selector(state, 'category')
return {
category,
}
})(Form)
const FormDecoratedComponent = reduxForm()(FormConnectDecorator)
我需要将表单连接到 redux 状态以读取类别值,但似乎无法将正确的动态表单名称值传递给它。
经过更多的浏览,由于formValueSelector返回一个函数,解决方案是在mapStateToProps中使用它。https://github.com/erikras/redux-form/issues/1987 上对里泽尔的演职员表
const mapStateToProps = (state, initialProps) => {
return {
category: (formValueSelector(initialProps.form))(state, 'category'),
};
};
const FormConnectDecorator = connect(mapStateToProps)(Form)
const FormDecoratedComponent = reduxForm()(FormConnectDecorator)
export default FormDecoratedComponent
@Mods - 如果您愿意,请随时删除此问题。答案已经存在于 redux 形式的 github 关闭问题中,上面提供了链接。