Skip to content

Preloader

We've implemented various pre-loaders as fallbacks in the project to enhance user experience. These pre-loaders provide immediate feedback, ensure smooth transitions during loading, and maintain consistency across devices and networks.

Usage

The default value of preloader in the app.config.js is set to disabled. We've created a changePreloaderaction in src/store/LoaderStore, allowing you to change the value dynamically.

Here's the list of available pre-loaders:

  • beat
  • bounce
  • clip
  • moon
vue

<template>
  <!--  @possible-values: beat, bounce, clip, moon -->
  <EBtn @click="loaderStore.changePreloader('beat')">
    Beat
  </EBtn>
</template>

<script setup>
  // ** Store Imports
  import {useLoaderStore} from "@/store/LoaderStore"

  // ** Vars
  const loaderStore = useLoaderStore()

  // This is how you get the preloader value
  const {preloader} = storeToRefs(loaderStore)

</script>

COPYRIGHT