<swiper
          :modules="modules"
            slides-per-view="auto"
            nested="true"
            :freeMode="true"
            :mousewheel="{ releaseOnEdges: true }"
            :scrollbar="{ draggable: true, hide: true }"
            class="swiper-container2"
            direction="vertical"
            @swiper="setControlledSwiper"
            @slideChange="onSlideChange"
        >
            <swiper-slide>内容</swiper-slide>
            <swiper-slide>内容</swiper-slide>
    </swiper>


import { Swiper, SwiperSlide } from "swiper/vue";
import "swiper/css";
import "swiper/css/pagination"; // 轮播图底面的小圆点
import { Mousewheel, Pagination } from "swiper/modules";
const modules = [Mousewheel, Pagination];


.swiper{
  width: 100%;
  height: 100vh;
}
.swiper-container2 .swiper-slide {
  height: auto;
}

关于swiper同向滑动（内容过长可滚动）轮播图的实现 - demo的文章 - 知乎
https://zhuanlan.zhihu.com/p/624398967