Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

stephan-v's avatar

Vuejs loading animation or fix?

I am using vue to render a list of some algolia results that I am fetching. For a split second I see the curly brace syntax with variables and a single list element before the rest is rendered. It is not much but it annoys me because it is ugly and shouldn't have to be there.

How can I go about fixing this? I don't want to stuff a big delay in there for users to see the data, so I wouldn't want to use an entire loading page. Maybe a small loading animation less than a second would help.

Is there anyone who knows how to go about doing this with vue or maybe somebody that has encountered this as well?

0 likes
2 replies
topvillas's avatar

Put some sort of loading flag in your Vue instance / component and use a v-show on the offending list.

FourStacks's avatar

Hi @stephan-v

Have you tried using the v-cloak directive on the component that's rendering the moustache tags?

http://vuejs.org/api/#v-cloak

That directive is specifically designed to hide this flash of uncomplicated content so give that a whirl

4 likes

Please or to participate in this conversation.