How to reset store observable when go to another page

[namlq93]

I have a snackbar store:

const snackbarInit = {
  message: '',
  isShown: false,
};

class SnackbarStore extends BaseStore {
  @observable snackbar: Snackbar = snackbarInit;

  @action setSnackbar = (snackbar: Snackbar) => {
    this.snackbar = snackbar;
  };

  @action closeSnackbar = () => {
    this.snackbar = snackbarInit;
  };
}

After display the snackbar, if user goes to another page by click to a link, I want to reset the observable snackbar to snackbarInit. How can I do that?

[urugator]

How do you reset non-observable store?

[namlq93]

I solved it by adding the following code to app.js

  const location = useLocation();
  useEffect(() => {
    SnackbarStore.closeSnackbar();
  }, [location]);