How to optimize my code with react, redux-toolkit and react-hook-form

Viewed 18

LANGUAGE : javascript (with react, redux toolkit, react hook form)

So i have an application with a form. The form have multiple step and multiple data who are depenting from each other. The user can naviguate between step and can save at any time

I've used react-hook-form to dispatch my data every time a value change.

  const data = watch()

 useEffect(() => {
dispatch(
  fetchUserData({
    name: data.name,
    price: data.price,
    number: data.number,
    langue: data.langue,
  })
);

dispatch(
  fetchOtherData({
    introduction: data.introduction,
    price: data.price,
    hour: data.hour, 
    profile: data.profile, 
    reduction: data.reduction, 
      })
    );
  }, [data, dispatch]);

But now, i have more than 20 dispatch a the first load of my application (because of the watch)

Is there a better way to do ? I can't use "onSubmit" because of the dependencies of my data with each other.

0 Answers
Related