在页面加载时从API导航到异步路由

Question

我正在通过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并使其在第一次尝试时起作用？