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.
Attribute | Type | Required | Description |
---|---|---|---|
slider | Object | false | The 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;
}
}