Composables is not working

[lymau]

Hello, I'm gonna say thank you for making this awesome project. I have once tried it before without using composables and it works fine. I like its simplicity of usage. Then, I tried to apply your composables in the SFC. I got this warning and the image is not showing. I think I carefully follow the step in documentation. So, just to be clear I provided my code.

The warning I got on console.

Here's my project specification: "vue": "^3.2.25", "vue-easy-lightbox": "^1.7.1",

I'm using default composable provided in documentation.

The trigger function is attached to img tag.

<img @click="show" :src="image">

Here's the vue-easy-lightbox component.

<vue-easy-lightbox :visible="visibleRef"
                                 :imgs="imgsRef"
                                 :index="indexRef"
                                 @hide="onHide"></vue-easy-lightbox>

Code in script setup.

import image from "@/assets/image.png"
import image_2 from "@/assets/image_2.png"
import {useEasyLightbox} from "vue-easy-lightbox"
const {show, onHide, changeIndex, visibleRef, indexRef, imgsRef} = useEasyLightbox({
  imgs: [
    image,
    iamge_2,
  ],
  initIndex: 0,
})

That's all. Any help would be appreciated. Thank you.

[XiongAmao]

HI,

I can not reproduce this issue. Can you provide a repo? It seems that indexRef has been changed somewhere.
By default, useEasyLightbox() just returns ref(0).

https://github.com/XiongAmao/vue-easy-lightbox/blob/3bcd56150910a60023a7e29a85fe82dab7384b1a/src/composables/index.ts#L18-L24

[lymau]

Hey, I think I know the problem. I forgot to add the parameter when calling show.

It didn't work

<img @click="show" :src="image">

This one work

<img @click="show(0)" :src="image">

I think you should update the docs. It was wrong. You should change the line 3 https://onycat.com/vue-easy-lightbox/guide/#composables to something like this

<img @click="show(0)" :src="image">

Thank you.

[XiongAmao]

Hi,

I found the problem, it is fixed in v1.8.1.

It works now:

<img @click="show" :src="image">