diff options
| -rw-r--r-- | src/App.vue | 16 | ||||
| -rw-r--r-- | src/router/index.ts | 5 |
2 files changed, 19 insertions, 2 deletions
diff --git a/src/App.vue b/src/App.vue index 435f7b2..f46f063 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,7 +1,11 @@ <template> <Logo class="header"/> <Navigation class="nav"/> - <router-view class="content"/> + <router-view v-if="loaded" class="content"/> + <main v-else class="content" role="alert" aria-busy="true"> + <h1> </h1> + <p>Loading...</p> + </main> <Copyright class="footer"/> </template> @@ -84,5 +88,13 @@ import Copyright from "@/components/Footer.vue"; Copyright, }, }) -export default class AppV extends Vue {} +export default class AppV extends Vue { + loaded = false; + + mounted () { + self.addEventListener("initial-load", () => { + this.loaded = true; + }); + } +} </script> diff --git a/src/router/index.ts b/src/router/index.ts index 8165667..04828e4 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -49,6 +49,11 @@ const router = createRouter({ routes, }); +router.beforeResolve((to, from, next) => { + self.dispatchEvent(new Event("initial-load")); + next(); +}); + router.afterEach((to,) => { const mainTitle = document.querySelector("#app > .content > h1"); |