React词尾形式-双条件形式

Question

我已经开始使用React最终表单进行表单项目，但我很难回答两个条件的问题。

有人知道如何在React最终形式上进行双条件逻辑吗？从这个例子中，给出了单条件逻辑代码：

const Condition = ({ when, is, children }) => ( <Field name={when} subscription={{ value: true }}>
{({ input: { value } }) => (value === is ? children : null)}  </Field>)

然而，我不知道如何做一个双重条件问题，在显示条件问题之前，需要检查表单中两个不同问题的两个不同答案。

谢谢：(

Answer 1

您可以使用react-final-form中的useFormState来获取当前表单状态，因此MultiCondition组件可能如下所示：

const MultiCondition = ({ condition, children }) => {
const { values = {} } = useFormState({ subscription: { values: true } });
return condition(values) ? children : null;
};

而不是表单中的某个地方：

<MultiCondition condition={({ gift, firstName }) => gift && firstName === "Joe"}>
<span>gets rendered when condition is satisfied</span>
</MultiCondition>