'react-hook-form doesn't render MUI RadioGroup with selected option when going back to previous step

I am trying to implement a multi-step form with react-hook-form(v6) using FormProvider and useFormContext API. I am using MUI(V5) as UI Component Library. When I go forward by click Next button form works fine. but when going back, previous step doesn't render MUI Radio with selected option.

I have created a sandbox to demonstrate what i am doing exactly - https://codesandbox.io/s/eager-tdd-hyye9z



Solution 1:[1]

In react-hook-form v6 i had to pass shouldUnregister: false in useForm options.

  const methods = useForm({
    mode: "all",
    reValidateMode: "onChange",
    defaultValues: {},
    shouldUnregister: false
  });

There is working example https://codesandbox.io/s/naughty-hodgkin-d7u4ee

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Sandeep vashisth