react-final-formfinal-form

React Final Form re-renders all fields while changing one of them

It is written in docs, that

The <Field/> will rerender any time the field state it is subscribed to changes.

So, if I'd have several Fields, all of them will be re-rendered, while changing only one of them. Are there any ways to prevent re-renders of other Fields, that are not changing at the moment?

Solution

  • Yes, that's because your entire form is rerendering. Your question is exactly the reason that Final Form was designed from the ground up to allow fine grained render control.

    Here's a video of me explaining it last month.

    Check out this example of how to do it.