react-final-form - React Final Form 在更改其中一个字段时重新渲染所有字段

Question

它写在文档中，即

<Field/>只要订阅的字段状态发生变化，就会重新呈现。

所以，如果我有几个字段，它们都将被重新渲染，而只更改其中一个。有什么方法可以防止其他字段的重新渲染，目前没有改变？

标签： react-final-formfinal-form

Answer 1

另一种解决方法是使用React.memo(react version >= 16.6.0)

使每个输入字段成为一个单独的组件，并将其包装在备忘录中。

export default React.memo(MyInputComponent);

如果您要向下传递值MyInputComponent，则只传递所需的道具值而不是整个表单数据对象。

<MyInputComponent value={formData.myValue} />

这样，MyInputComponent只有在formData.myValue发生更改时才会重新渲染。