基于子 State 使用 React - Redux 表单在父组件中启用禁用提交按钮

Question

我在 React 中有两个组件——父级和子级。 提交按钮位于父组件中。

我的问题是如何启用、禁用基于 redux 异步验证失败或传入子组件的父组件中的提交按钮。 另外，我将如何捕获验证失败的 redux state 并设置要发送给父级的道具以及如何将此道具发送给父级。

子组件上有一个 redux-form，父组件也连接到 redux 存储。

这两个组件都是功能组件，而不是 class。

是否有任何指针或示例应用程序可供参考？ 任何指针表示赞赏。

Answer 1

由于您使用的是 Redux 表单，因此您的子表单的值会动态发送到商店。

您可以使用 redux-form 选择器从任何地方（也在您的 Parent 组件中）从商店中读取。

您应该能够访问父级中的表单值，执行类似的操作

const myForm= formValueSelector('myFormName')

然后您可以从“ myForm ”计算您的“ isBtnIsDisabled ”并将isBtnIsDisabled发送到您的按钮