swiper最外層設置了 overflow hidden ，但是子元素有動畫或者彈窗需要超出，
swiper 外層 .swiper-container、swiper-wrapper、swiper-slide 都存在 position:relative 樣式， 直接 子元素absolute 無效
干脆去掉 overflow:hidden，但這樣 swiper 其他本該隱藏切換顯示的 swiper-slide 也顯示出來了，頁面混亂 無效
方案：
放大 swiper-container 的寬度和（或）高度，然后在 swiper-slide 層進行收緊，這樣就能將本來會溢出隱藏的目標元素展示出來。
相當于小盒子放不下，就拿個大盒子放，畫布太小畫不下，就換一個大畫布來畫。
如下圖 紅包 超出swiper容器， 父元素 Swiper設置2個 tailwind的類，高度和位置 -top-5 h-20
子元素再還原 高度可以不改， top-5
<Swiper
slidesPerView={1}
spaceBetween={0}
loop={fixedActivitySwiperList?.length > 1}
autoHeight={true}
direction='vertical'
autoplay={{
delay: 3000,
reverseDirection: true,
disableOnInteraction: false,
}}
modules={[Autoplay, Pagination, Navigation]}
className="-top-5"
style={{
height: pxToRem(110),
}}
>
{fixedActivitySwiperList &&
fixedActivitySwiperList.map((item: any, index: any) => {
return (
<SwiperSlide key={index + item.title} className="top-5">
<SlideDom key={index} item={item} index={index} slideClick={slideClick} />
</SwiperSlide>
)
})}
</Swiper>
浙公網安備 33010602011771號