Не листается вертикальный Swiper [NUXT]

Всем привет, столкнулся с такой проблемой что слайды просто не перелистываются/перетягиваются в вертикальном положении, а так же нету реакции на прокрутку колесика мышки. Но при этом в горизонтальном положении всё работает хорошо. Не могу понять в чём проблема. Использую библиотеку: nuxt-swiper

А так же заметил что пагинация пагинация находится на втором слайде. (см скриншот 1) Код:

<template>
<Swiper
    :modules="[SwiperMousewheel, SwiperPagination]"
    :slides-per-view="0"
    :direction="'vertical'"
    pagination
    mousewheel
    :grab-cursor="true"
>
  <SwiperSlide class="swiper_slide">
    <section class="biography">
      <div class="container">

      </div>
    </section>
  </SwiperSlide>

  <SwiperSlide class="swiper_slide">
    <section class="about">
      <div class="container">

      </div>
    </section>
  </SwiperSlide>

  <SwiperSlide class="swiper_slide">
    <section class="project">
      <div class="container">

      </div>
    </section>
  </SwiperSlide>
</Swiper>

<script setup lang="ts">

</script>

<style lang="scss" scoped>
.biography{
  background-color: gray;
  height: 100vh;
}
.about{
  background-color: purple;
  height: 100vh;
}
.project{
  background-color: red;
  height: 100vh;
}

</style>

Если поставить :slides-per-view="1", то появляется пустое пространство между, слайдами, с height в - 3.35544e+07px; (см скриншот 2)

Скриншоты проблемы: