SSENSE/vue-carousel

Question: How to retain the slide pagination position?

Ouverte

#226 ouverte le 25 juin 2018

 (5 commentaires) (0 réaction) (0 personne assignée)JavaScript (513 forks)batch import
help wantedquestion

Métriques du dépôt

Stars
 (1 705 étoiles)
Métriques de merge PR
 (Aucune PR mergée en 30 j)

Description

For example, I have 5 slides on the home page, each image per slide, and I move to the third slide and go to another page, I want to see that the carousel is still showing the third slide when I come back to home page.

I tried to wrap the carousel component within a keep alive tag, that didn't work. I didn't enable autoplay either (btw, I saw someone mentioned that autoplay, but I didn't see that was documented in here).

Is this something I can achieve by using the API from this plugin?

Here is the code snippet.

<template>
	<carousel v-if="imgSrcs.length" class="carousel" 
		:navigationEnabled="true"
		:perPage="1" 
		:perPageCustom="[[480,1],[768,2],[1200,3]]">

		<slide  v-for="(imgSrc, index) in imgSrcs" :key="index">
			<img :src=imgSrc>
			<div class="overlay">
				<p>this image url is: {{ imgSrc }}</p>
			</div>
		</slide>
	</carousel>
</template>

<script>
	import { mapGetters } from "vuex"

	export default {
		data () {
			return {
				slug: this.$route.params.slug ? this.$route.params.slug : "home",
				imgSrcs: []
			}
		},
		components: {
			...ComponentsList
		},
		mounted () {
			setTimeout( () => {
				this.imgSrcs = [
					"https://placeimg.com/640/480/animals/1", 
					"https://placeimg.com/640/480/animals/2",
					"https://placeimg.com/640/480/animals/3",
					"https://placeimg.com/640/480/animals/4",
					"https://placeimg.com/640/480/animals/5",
					"https://placeimg.com/640/480/animals/6",
				]
			}, 0);
		},
		computed: {
		   ...mapGetters(['allPagesData', 'currentPageData']),
		},
		watch: {
			'$route' (to, from) {
				if (to.params.hasOwnProperty("slug")) {
					this.slug = to.params.slug
				} else {
					this.slug = "home"
				}
			},
		}
	}
</script>

Guide contributeur