Control slide number

To open the gallery on a different slide than the first, specify the desired slide by using one of the three props: "slide" (integer), "sourceIndex" (integer, slide number minus one), or "source" (string, the source's URL or path itself).

<template>
	<div>
		<button @click="openLightboxOnSlide(1)">
			Open the lightbox on the first slide.
		</button>

		<button @click="openLightboxOnSlide(2)">
			Open the lightbox on the second slide.
		</button>

		<FsLightbox
			:toggler="toggler"
			:slide="slide"
			:sources="[
				"/Images/1.jpg",
				"/Images/2.jpg"
			]"
		 />
	</div>
</template>

<script>
	import FsLightbox from "fslightbox-vue";

	export default {
		components: { FsLightbox },
		data() {
			return {
				toggler: false,
				slide: 1
			}
		},
		methods: {
			openLightboxOnSlide: function(number) {
				this.slide = number;
				this.toggler = !this.toggler;
			}
		}
	}
</script>

In the above example there is presented the usage of the "slide" prop. The two other props—"sourceIndex" and "source"—are used analogously.