How to know the browser page whether is loading in Vue.js project?

Question

How to know the browser page whether is loading in Vue.js project?

in browser, such as in Chrome, if we open a page, if the networking is not finish, there will have a circle animation.

but in our development, how can we get this status?

Answer 1

You can do this using simple Javascript

if (document.readyState == "completed") {
    alert("Your page is loaded");
}

Return Value : A String, representing the status of the current document.

One of five values:

• uninitialized - Has not started loading yet
• loading - Is loading
• loaded - Has been loaded
• interactive - Has loaded enough and the user can interact with it
• complete - Fully loaded

For more details visit W3Schools - document.readystate .

Hope this solves your query.

Answer 2

I think what you are searching for is the javascript/HTML onLoad() event. It's called when a page has been loaded, as an HTML tag you can add a function call which will be executed once the page is loaded and same goes for Javascript where you can create an eventListener to call a function following the same event.

Here is an helpfull link: OnLoad W3School

Answer 3

Window.onload() method detect when a page is loaded. may this can be helpful

How do I detect when a web page is loaded?