<script setup>
import {getCurrentInstance, onMounted} from 'vue'
import { RouterView } from "vue-router"
import TopNavigation from "./components/navigation/TopNavigation.vue"
import SideNavigation from "./components/navigation/SideNavigation.vue"
import VueProgressBar from "./components/progressBar"
import {useCurrentUserStore} from "@/stores/CurrentUser";
const CurrentUserStore = useCurrentUserStore();
onMounted(() => {
const internalInstance = getCurrentInstance();
// [App.vue specific] When App.vue is first loaded start the progress bar
internalInstance.appContext.config.globalProperties.$Progress.start();
setTimeout(() => {
internalInstance.appContext.config.globalProperties.$Progress.finish();
}, 3500);
})
</script>
<template>
<TopNavigation v-if="CurrentUserStore.Data.IsAuthenticated" />
<div class="page-content">
<SideNavigation v-if="CurrentUserStore.Data.IsAuthenticated" />
<div class="content-wrapper">
<div class="content">
<RouterView />
</div>
</div>
</div>
<vue-progress-bar></vue-progress-bar>
</template>
<style scoped></style>
The component is shown as anonymous component within the vue def tools and I am not seeing anything of the progress bar. Not after startup nor while navigating two different "views" in router-view.
I am trying since about two days to make this component work within my single page trials.
main.js
app.vue
The component is shown as anonymous component within the vue def tools and I am not seeing anything of the progress bar. Not after startup nor while navigating two different "views" in router-view.
Is there somebody who could help me?