How do I connect Formik to Material UI's radio control group?

Question

I'm struggling to connect Material UIs Radio control group to Formik's useFormik() function. I've tried following other tutorials but they all either use typescript or use the <Formik> component, neither of which would be ideal. I'm very new to React, let alone JS & TS so please forgive my terrible coding style and conventions. Currently, the radio group value is successfully passed into Formik's database but the UI component isn't updating to show its been checked.

Here's a code Sandbox with where I'm at currently: https://codesandbox.io/s/epic-rgb-t9n0r?fontsize=14&hidenavigation=1&theme=dark

If I'm doing everything completely wrong and should just use <Formik> and <Field> s please let me know

Answer 1

Your values in <FormControlLabel should be strings, and it will work. Instead value={true} place value="true"