Ionic 5 react router cached

Hi,
I am using ionic with react, I have common component which is used on all changes for alerts which will check for redux state and display alerts based on isError true.
but when I move from 1-2 pages alerts is showing that many times as react router will cache it.
how to handle this kind of situation
here is what i am using

  useEffect(() => {
    if (isError) {
        notification(
          {
            show: true,
            message: errorMessage,
            type: 'error',
            autoHide: false,
          }
        );
      }
      dispatch({
        type: CLEAR_ERROR,
      });
    }
  }, [isError]);

need to see more code…

I would guess that you’ve implemented your code on each page, so it would show the alert for each page.

You’ll need to move the alert component up the hierarchy to a common parent component so that it is only implemented in one place.

1 Like