Я думаю, что у них нет прямого решения сделать это как ваш вопрос, так как каждый маршрут будет вызывать запросы, когда вы посещаете его, но вы можете попытаться исправить вашу проблему, выполнив этот трюк:
- ОбъявитьГлобальный или вспомогательный js-файл.
- после его объявления создайте в нем метод / методы, которые он будет вызывать чаще всего при посещении маршрута, и сохраните результат в глобальной переменной (например, aboutUsDataCache), которая может получить к нему доступ в маршруте..
- заменить все действия маршрутов запросов ajax на метод, который для него создан.
- добавить условие, чтобы проверить, пусто или нет aboutUsDataCache, если не пусто, то это означает, что мы инициируем запрос и имеем данные, и мынаходятся в SPA, поэтому мы не можем снова получить доступ к методу.
Пример из реального проекта: у меня есть main-config.js, который загружается перед маршрутами и имеет следующий код:
module.exports.tmpAppCache = {
fullCadaverList: false,
fullImagesList: false,
fullVideosList: false,
fullPdfList: false,
};
и у меня есть файл ajax-helper.js, который также загружается до маршрутов и имеет методы, подобные этому:
export function getFullPdfList() {
// Your ajax request here
}
в маршрутах имеет следующий код:
{
path: '/pdf/',
async: function (routeTo, routeFrom, resolve, reject) {
if(globalObject.tmpAppCache.fullPdfList !== false){
resolve(
{
component: pdfPage,
},
{
context: {
data: globalObject.tmpAppCache.fullPdfList
}
}
);
}else{ getFullPdfList()
}
},
},
TВ своем примере из реального проекта я пытаюсь убрать весь ненужный код, чтобы он был чем-то понятным, чтобы можно было кое-что заметить:
- В этом примере используется WebPack, чтобы вы могли некоторое время импортировать и экспортировать.
- Я удаляю обещание из функций, чтобы сделать пример кода понятным.
- , так как вам нужно инициировать все запросы при запуске, вам нужно вызывать все методы в индексном маршруте, чтобы при переходе на любую страницуКак и в нашем примере, вы увидите, что данные кэшируются, и запрос не сработает.
Удачи