Эффекты перехода страниц с глобальными средствами защиты Vue-Router - PullRequest
Новая
       10

Эффекты перехода страниц с глобальными средствами защиты Vue-Router

0 голосов
/ 20 ноября 2018

У меня есть глобальная vue-router навигационная защита - beforeResolve() ловушка - которая реализует базовую проверку подлинности по отношению к бэкенду: 

let router = new VueRouter({ routes });

router.beforeResolve((to, from, next) => {
    if(to.path === '/login') {
        next();
        return;
    }

    let auth = new JSUMC2Auth(UIConfig);
    let cfg = new JSUMC2ConfigKeys(UIConfig, configKeys);

    auth.try().then(r => {
        if(r.success)
            return Promise.resolve();

        return Promise.reject();
    }).then(() => {
        return cfg.fetchConfigKeys({
            authData: auth.getAuthParams()
        });
    }).then(() => {
        next();
    }).catch(e => {
        next({path: '/login', replace: true});
    });
});

let params = { router };

return new Vue(params);

Проблема, как вы можете догадаться, в том, что этоПроцесс навигации происходит с каждым переходом состояния (это очень наивная настройка аутентификации, без токенов и кеширования), есть задержка с момента, когда пользователь нажимает <router-link>, до момента, когда «экран» фактически начинает загружаться с любым сопровождающимсчетчики и т. д.

Итак, вопрос в следующем:

Учитывая, насколько абстрагирован этот навигационный щиток от какого-либо рендеринга или создания компонентов, есть ли какой-то способ, которым я могу сигнализировать об изменении состоянияк текущему компоненту, чтобы указать, что ловушка находится в процессе выполнения его async / Promise цепочки?

Я использую хранилище Vuex, если это помогает.Однако этот хук связан еще до того, как я создаю экземпляр корневого экземпляра Vue(), поэтому я не уверен, как бы я мог распоряжаться этим магазином, чтобы помочь ему, поскольку можно только предположить, что в магазине нет способа попасть в магазин.экземпляр внутри хука - по крайней мере, таким образом, что это приводит к значимым мутациям, видимым для других компонентов после инициализации корневого Vue() экземпляра.

Спасибо за вашу помощь!

...