Description

It is a default component to display a pagination of the images, good when it does not contain too many images.

Component

The component can have the following attributes.

AttributeTypeRequiredDescription
sliderObjectfalseThe VueFlux component

Example of pagination inside vue-flux

<vue-flux :options="fluxOptions" :images="fluxImages" :transitions="fluxTransitions">
    <flux-pagination slot="pagination"></flux-pagination>
</vue-flux>
import { VueFlux, FluxPagination, Transitions } from 'vue-flux';

export default {
   components: {
      VueFlux,
      FluxPagination
   },

   data: () => ({
      fluxOptions: {
         autoplay: true
      },
      fluxImages: [ 'URL1', 'URL2', 'URL3' ],
      fluxTransitions: Transitions
   })
}

Example of pagination outside vue-flux

<vue-flux
   :options="fluxOptions"
   :images="fluxImages"
   :transitions="fluxTransitions"
   ref="slider">
</vue-flux>

<flux-pagination v-if="mounted" :slider="$refs.slider"></flux-pagination>
import { VueFlux, FluxPagination, Transitions } from 'vue-flux';

export default {
   components: {
      VueFlux,
      FluxPagination
   },

   data: () => ({
      mounted: false,
      fluxOptions: {
         autoplay: true
      },
      fluxImages: [ 'URL1', 'URL2', 'URL3' ],
      fluxTransitions: Transitions
   }),

   mounted() {
      this.mounted = true;
   }
}