Обновление состояния Vue во время навигации с помощью vue-router

Question

Я создаю приложение Vue 3, которое использует Vue Router и Pinia для управления состоянием.

В моем глобальном состоянии я определяю свойство, которое сообщает мне, вошел ли пользователь в систему, чтобы пользователь мог перемещаться по приложению. Однако процесс входа в систему обрабатывается Cognito, поэтому, как только я войду в приложение, я нажму кнопку входа, и я попаду на экран Cognito, который обрабатывает процесс входа, а затем перенаправит меня обратно на домашнюю страницу моего приложения.

Итак, после перенаправления я извлекаю некоторые параметры из полученного URL-адреса и хочу сохранить их в глобальном состоянии, для этого я использовал beforeEachGuard для анализа URL-адреса, проверки параметров, обновления хранилища и последующего чтения из него для проверки действительного сеанса.

Но моя проблема заключалась в том, что навигация продолжалась даже до того, как состояние было обновлено. Я закончил тем, что использовал setTimeoutпросто чтобы посмотреть, решило ли ожидание немного проблему, и это сделало

          router.beforeEach((to) => {
  const mainStore = useMainStore();
  if (to.name === 'Login') {
    return;
  }

  if (to.hash !== '') {
    const queryParams = window.location.href.split('&');

    const paramValues = queryParams.map(param => {
    })

    const payload = {
      id_token: paramValues.find(param => param.name === 'id_token').value,
      access_token: paramValues.find(param => param.name === 'access_token').value,
      token_type: paramValues.find(param => param.name === 'token_type').value,
      isAuthenticated: true
    }

    //Here I'm trying to update my global state
    mainStore.updateTokens(payload);
  }

  // Here I use timeout, but before I just had the check for the property
  setTimeout(() => {
    if (!mainStore.isAuthenticated) return '/login';
  }, 3000)
});

Как мне поступить в этом случае? я читал о beforeResolveGuard, но я не уверен, как его использовать; в основном мне просто нужно знать, как мне выполнять некоторые асинхронные операции (например, получение данных с сервера) во время навигации, а не внутри компонентов.