Formik: InitialValues (with enableReinitialize) should reset form in getDerivedStateFromProps instead of componentDidUpdate

Created on 3 Jul 2018 · 6Comments · Source: formium/formik

Current Behavior

The problem here is that componentDidUpdate runs after react render, so by using it to reset the values from the new initialValues (when enableReinitialize is enabled), we get one useless render pass. getDerivedStateFromProps runs before render, so it would be better suited to reset the form.

Steps to Reproduce

const SchemaForm = ({
  metadata,
  initialValues,
  onSubmit,
}) => {
  return (
    <Formik
      enableReinitialize
      initialValues={buildValues(metadata, initialValues)}
      onSubmit={(values) => {
        onSubmit(values);
      }}
      render={({ handleSubmit, values, ...props }) => (
        //BUG here we get one render where metadata may be updated, but values is not
        <form onSubmit={handleSubmit} noValidate="novalidate">
          <SchemaFormFields metadata={metadata} {...props} values={values} />
        </form>
      )}
    />
  );
};

Suggested solution(s)

It's not a big deal per se, but in my case it is. My specific use case is that my custom FormComponent receives some metadata to generate a form dynamically. It build a values map to pass to formik in initialValues. The bug I have since the formik update for React 16.3 is that I get one render with the new metadata (since it's in a prop) and the old values (in formik render method), which makes everything crash. If the form would reset before the render, the formik render method would be called with the new values and everything would be fine.

Formik Version: 1.0.0-beta.4
React Version: 16.3.0
TypeScript Version: N/A
Browser and Version: Chrome 67
OS: OSX
Node Version: 8.2.1
Package Manager and Version: NPM 6.1

stale

Source

matdurand

👍3

Most helpful comment

hollering

Working around it by adding if (initialValues !== props.initialValues) return null; to Formik renderFn

panstav on 28 Nov 2018

👍5

All 6 comments

Hola! So here's the deal, between open source and my day job and life and what not, I have a lot to manage, so I use a GitHub bot to automate a few things here and there. This particular GitHub bot is going to mark this as stale because it has not had recent activity for a while. It will be closed if no further activity occurs in a few days. Do not take this personally--seriously--this is a completely automated action. If this is a mistake, just make a comment, DM me, send a carrier pidgeon, or a smoke signal.