How to implement a loading screen for a SPA written in Vue.js?

Question

I am new to Vue.js, coming from AngularJS 1. Does anybody have tips on how to implement a loading screen such as PleaseWait?

tony19 · Accepted Answer · 2022-07-15 04:38:38Z

6

I also created an example that integrated with PleaseWait.js

http://codepen.io/CodinCat/pen/ZeKxgK?editors=1010

Since PleaseWait.js manipulates real DOM directly, the code becomes a little bit tricky. I'd recommend to re-implement this library in Vue.js. Vue does have transitions: https://v2.vuejs.org/v2/guide/transitions.html

You can just create a component for it, and use v-if to hide/show it

<loading-screen v-if="isLoading"></loading-screen>

A very simple example: http://codepen.io/CodinCat/pen/MpmVMp

edited Jul 15, 2022 at 4:38

tony19

140k24 gold badges281 silver badges354 bronze badges

answered Mar 12, 2017 at 5:22

CodinCat

16k6 gold badges51 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to implement a loading screen for a SPA written in Vue.js?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related