3D Coverflow Effect is used in the project, but in the same page, it will be affected by other components (switch,popup) (with animation or transition effects during operation, such as the display and hiding of mask layers, the switch switch of switch), resulting in the dislocation of each slider and the failure to scroll properly.
`
<swiper :options="swiperOption">
<swiper-slide>
</swiper-slide>
</swiper>
<yd-switch
v-model="swtich1">
</yd-switch>
swiperOption: {
effect: "coverflow",
grabCursor: true,
centeredSlides: true,
slidesPerView: "auto",
coverflowEffect: {
rotate: 0,
stretch: -80, // slide
depth: 400, // slide
modifier: 0.5, //
slideShadows: false //
},
pagination: {
el: ".swiper-pagination",
type: "bullets"
}
}
`