Search code examples
javascriptvue.jsbuefy

Buefy Loading on b-table


I am trying to edit the animation in the Buefy loader in order to add text while the loader is working and my data is loading into the b-table. Is there a way that I can modify the built in loader?

I would prefer if there was some customization around this so I could use the vue spinner with some text for my application loading state,

this vue-spinner has good examples of what I'm trying to achieve: http://greyby.github.io/vue-spinner/?ref=madewithvuejs.com

for code:

I have a loading prop for my b-table, which i set it to "isloading" and on different states in my application i change isloading to true or false.


Solution

  • I worked around this with using CSS to style the loader, for a more visible loader.

    I also added a div tag within the table and styled it to be absolute positioning so i can get it closer to the loader and filled it up with text.

    You can also hide the current loader with css display:none and replace it with your own version.

    That is what worked for me.