Quantcast
Channel: How to display an element in Vue component only after NProgress.done() - Stack Overflow
Viewing all articles
Browse latest Browse all 2

How to display an element in Vue component only after NProgress.done()

$
0
0

For displaying the loading status in a VueJS application I use the library NProgress. It works well and shows the loading bar and the spinning wheel. However the HTML content of the page is already rendered and displayed. I'd like to hide certain parts of the page while the request is running.

Is there any possibility to check programmatically for NProgress.done() and display the contents after it has been called?

I'd like something like this:

<template><div><NavBar /><div v-show="check here for NProgress.done()"><p>Here are all the nice things with placeholders for the data from the API.</p></div></div></template><script>import NavBar from '@/components/NavBar';export default {    components: {        NavBar    }}</script>

The part "check here for NProgress.done()" is what I don't know how to solve.


Viewing all articles
Browse latest Browse all 2

Latest Images

Trending Articles



Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>
<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596344.js" async> </script>