reactjs - 反应最终形式条件表单字段在渲染时未获取值

Question

我有一个表单字段，我想根据另一个字段的值来呈现。

我监听该字段的“OnChange”事件，然后触发新字段的form.change（尚未渲染），但在渲染时它不会获得值。

我为这个问题创建了一个沙箱：https ://codesandbox.io/embed/priceless-keldysh-gfd3b

预期结果：选择“加热”时，应显示比例因子并获得值“1”

解决这个问题的最佳做法是什么？假设表单中有很多依赖项。

Answer 1

由于订阅<Form />需要可见<Field />

但是当 values.meterType !== "heat" 时，您的字段 scalingFactor 将被删除

{values.meterType && values.meterType === "heat" && (
  <Field name="scalingFactor" component="input" />
)}

您需要将代码更改如下：

<Field name="scalingFactor">
  {({ input }) => {
    return (
      <React.Fragment>                    
        {values.meterType && values.meterType === "heat" &&
          <input {...input} />
        }
      </React.Fragment>
    );
  }}
</Field>