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 usage of the "slide" prop. The two other props—"sourceIndex" and "source"—are used analogously.