How to set focus to slide[index]?

[clabnet]

I have an array of 22 slides, the requirement is to show the current slide with focus at center of page.
When I open the web page (Vue3) I would set the focus in the slide with index = 0. How to ?

Here my options:

const slideOptions = reactive<Options>({
    type: 'loop',
    perPage: slotAtBottom,
    focus: 'center',
    autoplay: refAutoplay.value,
    interval: refInterval.value,
    flickMaxPages: 3,
    updateOnMove: true,
    pagination: false,
    throttle: 300,
    breakpoints: {
      1440: {
        perPage: 1,
        padding: '30%',
      },
    },
    autoHeight: true,
    pauseOnHover: true,
    rewind: true,
    gap: '8.8rem',
    autoWidth: true,
    arrows: true,
    slideFocus: true,
    isNavigation: true,
    resetProgress: false,
    perMove: 1,
    trimSpace: true,
  })

[clabnet]

I have tried this : https://splidejs.com/guides/apis/#go
but it seems don't work the go command.

  // Accessing Splide Instance
  const **splide** = ref()
  
  onMounted(() => {
    if (splide.value && splide.value.splide) {
      console.log('onMounted', splide.value.splide.length, 'slides')
      // Goes to the slide 1:
      splide.value.go(1)
    }
  })
  ...
   <Splide class="min-h-72" :options="slideOptions" :has-track="false" ref="splide">
          <div style="position: relative">
            <SplideTrack>
              <SplideSlide v-for="slide in slides" :key="slide.alt">
                <img :src="slide.src" :alt="slide.alt" />
              </SplideSlide>
            </SplideTrack>
          </div>
          ...
   </Splide>

Any suggestion please ?
Thank's

[samuelreichor]

Same Problem