javascript - 获取未知表单的 Redux 表单值

Question

我有一个组件，其中包含用于以不同形式组合的相关字段。有时它属于一个 FieldArray。一个字段的值必须影响另一个字段的表示。

在这种情况下是否有一种简洁的方法来访问字段值？

const MyReusableFields = () => {
  return (
    <div>
      <Field
        component={TextField}
        name="fieldA"
      />
      {fieldA === 'something' && // How can he get fieldA's value here?
        <Field
          component={TextField}
          name="fieldB"
        />
      }
    </div>
  );
};

我认为我不能使用 formValueSelector 或 getFormValues 因为我不知道表单的名称。即使我知道表单的名称，我也不知道确切的字段名称，因为在 FieldArray 下它将有一个不可知的前缀。

我想象一些丑陋的代码通过状态搜索，但我更愿意使用框架支持的模式(如果存在)。

Answer 1

我想我可能已经在这里粗略地回答了你的问题https://github.com/erikras/redux-form/issues/3103#issuecomment-312556081

如果您正在创建一个 UI 小部件，其中有少量相互关联的字段字段可能是您想要的。

值得注意的是，您可以从 this.context._reduxForm.form 中注入(inject)表单名称 - 您可以制作一个 withFormName HOC 来包装 connect 并在 connect 中使用 ownProps.form 来选择您要查找的值。

在此之后，它就变成了你的架构问题......

例如，您似乎声明您不知道字段名称，因为您不知道字段所在的上下文。但是 fieldNames 是绝对的，除非您使用的是表单部分。例如，字段数组中名称为“hello”的字段会将其值存储在 store.form.formName.hello 下 - 而不是数组前缀值下 - 除非您将这些前缀传递给组件并手动添加前缀(这就是为什么字段.map 返回字段名称)。

关键是您通常必须预先知道名称，因为您是将它们指定给 Field/Fields 组件的人。如果您使用的是 FormSections，则所有三个组件都有一个 name 属性，该属性将返回考虑到 FormSection 上下文的名称。

由于这些原因，我真的无法理解为什么您不能使用表单值选择器或字段来创建条件表单值填充。事实上，这些确实是您可以了解字段条件呈现值的唯一标准方法。

请注意，如果您使用字段，您将无法像使用条件字段渲染那样正确注册/注销，但这对您来说可能重要也可能不重要。