分包准备

zhuguifei

2025-07-04 186d172fc06dfe44dc2a61d238356e6a7db652d5

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
import effectInit from '../../shared/effect-init.js'; 
import effectTarget from '../../shared/effect-target.js'; 
import effectVirtualTransitionEnd from '../../shared/effect-virtual-transition-end.js'; 
 
export default function EffectFlip({ 
    swiper, 
    extendParams, 
    on 
}) { 
    extendParams({ 
        flipEffect: { 
            slideShadows: true, 
            limitRotation: true, 
            transformEl: null, 
        }, 
    }); 
 
    const setTranslate = () => { 
        const { 
            slides, 
            rtlTranslate: rtl 
        } = swiper; 
        const params = swiper.params.flipEffect; 
        for (let i = 0; i < slides.length; i += 1) { 
            const $slideEl = slides[i]; 
            let progress = $slideEl.progress; 
            if (swiper.params.flipEffect.limitRotation) { 
                progress = Math.max(Math.min($slideEl.progress, 1), -1); 
            } 
            const offset = $slideEl.swiperSlideOffset; 
            const rotate = -180 * progress; 
            let rotateY = rotate; 
            let rotateX = 0; 
            let tx = swiper.params.cssMode ? -offset - swiper.translate : -offset; 
            let ty = 0; 
            if (!swiper.isHorizontal()) { 
                ty = tx; 
                tx = 0; 
                rotateX = -rotateY; 
                rotateY = 0; 
            } else if (rtl) { 
                rotateY = -rotateY; 
            } 
            $slideEl.css({ 
                zIndex: -Math.abs(Math.round(progress)) + slides.length 
            }) 
            // if (params.slideShadows) { 
            //   // Set shadows 
            //   let shadowBefore = swiper.isHorizontal() 
            //     ? $slideEl.find('.swiper-slide-shadow-left') 
            //     : $slideEl.find('.swiper-slide-shadow-top'); 
            //   let shadowAfter = swiper.isHorizontal() 
            //     ? $slideEl.find('.swiper-slide-shadow-right') 
            //     : $slideEl.find('.swiper-slide-shadow-bottom'); 
            //   if (shadowBefore.length === 0) { 
            //     shadowBefore = createShadow(params, $slideEl, swiper.isHorizontal() ? 'left' : 'top'); 
            //   } 
            //   if (shadowAfter.length === 0) { 
            //     shadowAfter = createShadow(params, $slideEl, swiper.isHorizontal() ? 'right' : 'bottom'); 
            //   } 
            //   if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0); 
            //   if (shadowAfter.length) shadowAfter[0].style.opacity = Math.max(progress, 0); 
            // } 
            const transform = `translate3d(${tx}px, ${ty}px, 0px) rotateX(${rotateX}deg) rotateY(${rotateY}deg)`; 
            const $targetEl = effectTarget(params, $slideEl); 
            $targetEl.transform(transform); 
            if (swiper.params.willChange) { 
                $targetEl.willChange("transform"); 
            } 
            slides[i].addClass('swiper-slide-flip') 
        } 
    }; 
 
    const setTransition = (duration) => { 
        const { 
            transformEl 
        } = swiper.params.flipEffect; 
        const $transitionElements = transformEl ? swiper.slides.find(transformEl) : swiper.slides; 
        for (let i = 0; i < $transitionElements.length; i += 1) { 
            $transitionElements[i].transition(duration); 
        } 
        effectVirtualTransitionEnd({ 
            swiper, 
            duration, 
            transformEl 
        }); 
    }; 
 
    effectInit({ 
        effect: 'flip', 
        swiper, 
        on, 
        setTranslate, 
        setTransition, 
        perspective: () => true, 
        overwriteParams: () => ({ 
            slidesPerView: 1, 
            slidesPerGroup: 1, 
            watchSlidesProgress: true, 
            spaceBetween: 0, 
            virtualTranslate: !swiper.params.cssMode, 
        }), 
    }); 
}