Formik: Add enableReinitialize option and set it to false by default

Created on 21 Sep 2017  路  6Comments  路  Source: formium/formik

Currently, if you pass initialValues, you can overwrite them by passing another value - the form will update its values.

This brings a problem when your data is stored for example in redux or in another component. You get this data and pass into form. Once this values are changed (in redux / another component) - your form magically updates and removes all data you've changed.

In redux-form there is a nice enableReinitialize option which is false by default. You can set it to true and your form will update itself.

I think, the same behavior and option should be added to formik so your data won't suddenly disappear.


Related issues - https://github.com/jaredpalmer/formik/issues/163, https://github.com/jaredpalmer/formik/issues/164

For the first related issue, there is keepDirtyOnReinitialize option which prevents form from refreshing dirty values on initialValues change.

Enhancement

Most helpful comment

@megazoll mapPropsToValues will only pass props that are not functions by default. If you have an edge case, can you share it in a separate issue?

@VladShcherbin I have added enableReinitialize to master and initialValues is now passed down to props and through context. Should be trivial to get behavior you desire.

All 6 comments

Yeah this is a good idea. What do you think @eonwhite ?

Solution is here: https://github.com/jaredpalmer/formik/pull/181#issuecomment-332594908.

tl;dr: Just use React 馃槃, componentWillReceiveProps and setValues...

@jaredpalmer this is not a solution, it's a dirty workaround you can use to kinda solve this.

I don't understand, why normal solution can't be done in formik as it's done in redux-form. It's good default behavior and there is no point of not having it in formik.

@jaredpalmer agree with @VladShcherbin, auto resetting form on changing initialValues very unclearly and unwanted behaviour.
Also default function mapPropsToValues works incorrect on most of my cases and I'd prefer to see default empty initial values and pass mapPropsToValues directly when needed.

P.S. Anyway thanks for your job, it's a good solution for forms in React.

@megazoll mapPropsToValues will only pass props that are not functions by default. If you have an edge case, can you share it in a separate issue?

@VladShcherbin I have added enableReinitialize to master and initialValues is now passed down to props and through context. Should be trivial to get behavior you desire.

@jaredpalmer yaaay, great news. Thank you 馃帀

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jaredpalmer picture jaredpalmer  路  3Comments

najisawas picture najisawas  路  3Comments

sibelius picture sibelius  路  3Comments

dearcodes picture dearcodes  路  3Comments

jordantrainor picture jordantrainor  路  3Comments