Перейдите к асинхронному маршруту из API при загрузке страницы. - PullRequest
Новая
       7

Перейдите к асинхронному маршруту из API при загрузке страницы.

0 голосов
/ 11 октября 2018

Я загружаю свои маршруты через API.Это прекрасно работает, пока вы запускаете страницу из корня #/, и я могу загружать страницы через <router-link> очень хорошо (т.е. #/SomeSubPage).

Проблемы возникают при попытке перейтина #/SomeSubPage напрямую (постоянная ссылка на http://mysite/#SomeSubPage), или при нажатии кнопки обновления в браузере, когда вы находитесь на маршруте.

Я понимаю, что это потому, что маршруты загружаются из API, что означаетони недоступны при начальной загрузке страницы, поэтому vue-router еще не знает о них.

Пример добавления маршрутов: 

fetch('http://mysite/api/routes').then(response => response.json())
    .then(function(myRoutes) {
       myRoutes.forEach(function(myRoute) {
           router.addRoutes([{
               path: myRoute.path,
               component: () => import('somecomponent.vue')
           }]);
       });
    });

Посмотрим как этозагружается асинхронно и не загружается до тех пор, пока после первой инициализации маршрута не будет перехвачен любой запрос к #/SomeSubPage, поскольку определение маршрута еще не готово.

Существует ли способ заставить vue-router обновлять себя, когдадобавлен новый маршрут, так что вы можете перейти на #/SomeSubPage и он будет работать с первой попытки?

...