How to use setFieldValue without any event calls (onChange onBlur ..)

[SHUJAAT-DEV]

❓Question

In my situation, I need to set Select value on some conditions, the setFieldValue(name, values) cause a loop. I need help to handle such a situation where you need to set the value without using any event calls. your response highly appreciated.

if (val) { setFieldValue(name, { label: val[0].concept.display, value: val[0].concept.uuid })

[vikingair]

It's not clear where you're calling the above code. If you're calling it inside of a function that returns the render result, you cause site effects.

Maybe what you actually need is something like:

useEffect(() => {
    if (val) setFieldValue(name, { label: val[0].concept.display, value: val[0].concept.uuid });
}, [val]);

[hrgui]

To use setFieldValue without using any event calls:

• If using useFormik api, that returns a setFieldValue. That can be then in tandem used with useEffect, like @fdc-viktor-luft 's example.
• If using Formik api, that returns a FormikBag when using children render function. The FormikBag contains a setFieldValue. This cannot use useEffect in the render function, because React hooks can only be called in the top level. We have to create another component and pass in setFieldValue.
• If using Field or useField, that returns a setFieldValue through the form prop, or through useField it has setFieldValue also through FieldHelperProps. useEffect can also help here.

---

setFieldValue cannot be called outside of Formik's scope (for example: through a Redux thunk).