1 | 1 |
deleted file mode 100644 |
... | ... |
@@ -1,623 +0,0 @@ |
1 |
-import { h, ref, onMounted, onUpdated, onBeforeUnmount, watch } from 'vue'; |
|
2 |
-import { getParams } from './get-params'; |
|
3 |
-import { initSwiper } from './init-swiper'; |
|
4 |
-import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses } from './utils'; |
|
5 |
-import { renderLoop, calcLoopedSlides } from './loop'; |
|
6 |
-import { getChangedParams } from './get-changed-params'; |
|
7 |
-import { getChildren } from './get-children'; |
|
8 |
-import { updateSwiper } from './update-swiper'; |
|
9 |
-import { renderVirtual, updateOnVirtualData } from './virtual'; |
|
10 |
-var Swiper = { |
|
11 |
- name: 'Swiper', |
|
12 |
- props: { |
|
13 |
- tag: { |
|
14 |
- type: String, |
|
15 |
- default: 'div' |
|
16 |
- }, |
|
17 |
- wrapperTag: { |
|
18 |
- type: String, |
|
19 |
- default: 'div' |
|
20 |
- }, |
|
21 |
- init: { |
|
22 |
- type: Boolean, |
|
23 |
- default: undefined |
|
24 |
- }, |
|
25 |
- direction: { |
|
26 |
- type: String, |
|
27 |
- default: undefined |
|
28 |
- }, |
|
29 |
- touchEventsTarget: { |
|
30 |
- type: String, |
|
31 |
- default: undefined |
|
32 |
- }, |
|
33 |
- initialSlide: { |
|
34 |
- type: Number, |
|
35 |
- default: undefined |
|
36 |
- }, |
|
37 |
- speed: { |
|
38 |
- type: Number, |
|
39 |
- default: undefined |
|
40 |
- }, |
|
41 |
- cssMode: { |
|
42 |
- type: Boolean, |
|
43 |
- default: undefined |
|
44 |
- }, |
|
45 |
- updateOnWindowResize: { |
|
46 |
- type: Boolean, |
|
47 |
- default: undefined |
|
48 |
- }, |
|
49 |
- nested: { |
|
50 |
- type: Boolean, |
|
51 |
- default: undefined |
|
52 |
- }, |
|
53 |
- width: { |
|
54 |
- type: Number, |
|
55 |
- default: undefined |
|
56 |
- }, |
|
57 |
- height: { |
|
58 |
- type: Number, |
|
59 |
- default: undefined |
|
60 |
- }, |
|
61 |
- preventInteractionOnTransition: { |
|
62 |
- type: Boolean, |
|
63 |
- default: undefined |
|
64 |
- }, |
|
65 |
- userAgent: { |
|
66 |
- type: String, |
|
67 |
- default: undefined |
|
68 |
- }, |
|
69 |
- url: { |
|
70 |
- type: String, |
|
71 |
- default: undefined |
|
72 |
- }, |
|
73 |
- edgeSwipeDetection: { |
|
74 |
- type: Boolean, |
|
75 |
- default: undefined |
|
76 |
- }, |
|
77 |
- edgeSwipeThreshold: { |
|
78 |
- type: Number, |
|
79 |
- default: undefined |
|
80 |
- }, |
|
81 |
- freeMode: { |
|
82 |
- type: Boolean, |
|
83 |
- default: undefined |
|
84 |
- }, |
|
85 |
- freeModeMomentum: { |
|
86 |
- type: Boolean, |
|
87 |
- default: undefined |
|
88 |
- }, |
|
89 |
- freeModeMomentumRatio: { |
|
90 |
- type: Number, |
|
91 |
- default: undefined |
|
92 |
- }, |
|
93 |
- freeModeMomentumBounce: { |
|
94 |
- type: Boolean, |
|
95 |
- default: undefined |
|
96 |
- }, |
|
97 |
- freeModeMomentumBounceRatio: { |
|
98 |
- type: Number, |
|
99 |
- default: undefined |
|
100 |
- }, |
|
101 |
- freeModeMomentumVelocityRatio: { |
|
102 |
- type: Number, |
|
103 |
- default: undefined |
|
104 |
- }, |
|
105 |
- freeModeSticky: { |
|
106 |
- type: Boolean, |
|
107 |
- default: undefined |
|
108 |
- }, |
|
109 |
- freeModeMinimumVelocity: { |
|
110 |
- type: Number, |
|
111 |
- default: undefined |
|
112 |
- }, |
|
113 |
- autoHeight: { |
|
114 |
- type: Boolean, |
|
115 |
- default: undefined |
|
116 |
- }, |
|
117 |
- setWrapperSize: { |
|
118 |
- type: Boolean, |
|
119 |
- default: undefined |
|
120 |
- }, |
|
121 |
- virtualTranslate: { |
|
122 |
- type: Boolean, |
|
123 |
- default: undefined |
|
124 |
- }, |
|
125 |
- effect: { |
|
126 |
- type: String, |
|
127 |
- default: undefined |
|
128 |
- }, |
|
129 |
- breakpoints: { |
|
130 |
- type: Object, |
|
131 |
- default: undefined |
|
132 |
- }, |
|
133 |
- spaceBetween: { |
|
134 |
- type: Number, |
|
135 |
- default: undefined |
|
136 |
- }, |
|
137 |
- slidesPerView: { |
|
138 |
- type: [Number, String], |
|
139 |
- default: undefined |
|
140 |
- }, |
|
141 |
- slidesPerColumn: { |
|
142 |
- type: Number, |
|
143 |
- default: undefined |
|
144 |
- }, |
|
145 |
- slidesPerColumnFill: { |
|
146 |
- type: String, |
|
147 |
- default: undefined |
|
148 |
- }, |
|
149 |
- slidesPerGroup: { |
|
150 |
- type: Number, |
|
151 |
- default: undefined |
|
152 |
- }, |
|
153 |
- slidesPerGroupSkip: { |
|
154 |
- type: Number, |
|
155 |
- default: undefined |
|
156 |
- }, |
|
157 |
- centeredSlides: { |
|
158 |
- type: Boolean, |
|
159 |
- default: undefined |
|
160 |
- }, |
|
161 |
- centeredSlidesBounds: { |
|
162 |
- type: Boolean, |
|
163 |
- default: undefined |
|
164 |
- }, |
|
165 |
- slidesOffsetBefore: { |
|
166 |
- type: Number, |
|
167 |
- default: undefined |
|
168 |
- }, |
|
169 |
- slidesOffsetAfter: { |
|
170 |
- type: Number, |
|
171 |
- default: undefined |
|
172 |
- }, |
|
173 |
- normalizeSlideIndex: { |
|
174 |
- type: Boolean, |
|
175 |
- default: undefined |
|
176 |
- }, |
|
177 |
- centerInsufficientSlides: { |
|
178 |
- type: Boolean, |
|
179 |
- default: undefined |
|
180 |
- }, |
|
181 |
- watchOverflow: { |
|
182 |
- type: Boolean, |
|
183 |
- default: undefined |
|
184 |
- }, |
|
185 |
- roundLengths: { |
|
186 |
- type: Boolean, |
|
187 |
- default: undefined |
|
188 |
- }, |
|
189 |
- touchRatio: { |
|
190 |
- type: Number, |
|
191 |
- default: undefined |
|
192 |
- }, |
|
193 |
- touchAngle: { |
|
194 |
- type: Number, |
|
195 |
- default: undefined |
|
196 |
- }, |
|
197 |
- simulateTouch: { |
|
198 |
- type: Boolean, |
|
199 |
- default: undefined |
|
200 |
- }, |
|
201 |
- shortSwipes: { |
|
202 |
- type: Boolean, |
|
203 |
- default: undefined |
|
204 |
- }, |
|
205 |
- longSwipes: { |
|
206 |
- type: Boolean, |
|
207 |
- default: undefined |
|
208 |
- }, |
|
209 |
- longSwipesRatio: { |
|
210 |
- type: Number, |
|
211 |
- default: undefined |
|
212 |
- }, |
|
213 |
- longSwipesMs: { |
|
214 |
- type: Number, |
|
215 |
- default: undefined |
|
216 |
- }, |
|
217 |
- followFinger: { |
|
218 |
- type: Boolean, |
|
219 |
- default: undefined |
|
220 |
- }, |
|
221 |
- allowTouchMove: { |
|
222 |
- type: Boolean, |
|
223 |
- default: undefined |
|
224 |
- }, |
|
225 |
- threshold: { |
|
226 |
- type: Number, |
|
227 |
- default: undefined |
|
228 |
- }, |
|
229 |
- touchMoveStopPropagation: { |
|
230 |
- type: Boolean, |
|
231 |
- default: undefined |
|
232 |
- }, |
|
233 |
- touchStartPreventDefault: { |
|
234 |
- type: Boolean, |
|
235 |
- default: undefined |
|
236 |
- }, |
|
237 |
- touchStartForcePreventDefault: { |
|
238 |
- type: Boolean, |
|
239 |
- default: undefined |
|
240 |
- }, |
|
241 |
- touchReleaseOnEdges: { |
|
242 |
- type: Boolean, |
|
243 |
- default: undefined |
|
244 |
- }, |
|
245 |
- uniqueNavElements: { |
|
246 |
- type: Boolean, |
|
247 |
- default: undefined |
|
248 |
- }, |
|
249 |
- resistance: { |
|
250 |
- type: Boolean, |
|
251 |
- default: undefined |
|
252 |
- }, |
|
253 |
- resistanceRatio: { |
|
254 |
- type: Number, |
|
255 |
- default: undefined |
|
256 |
- }, |
|
257 |
- watchSlidesProgress: { |
|
258 |
- type: Boolean, |
|
259 |
- default: undefined |
|
260 |
- }, |
|
261 |
- watchSlidesVisibility: { |
|
262 |
- type: Boolean, |
|
263 |
- default: undefined |
|
264 |
- }, |
|
265 |
- grabCursor: { |
|
266 |
- type: Boolean, |
|
267 |
- default: undefined |
|
268 |
- }, |
|
269 |
- preventClicks: { |
|
270 |
- type: Boolean, |
|
271 |
- default: undefined |
|
272 |
- }, |
|
273 |
- preventClicksPropagation: { |
|
274 |
- type: Boolean, |
|
275 |
- default: undefined |
|
276 |
- }, |
|
277 |
- slideToClickedSlide: { |
|
278 |
- type: Boolean, |
|
279 |
- default: undefined |
|
280 |
- }, |
|
281 |
- preloadImages: { |
|
282 |
- type: Boolean, |
|
283 |
- default: undefined |
|
284 |
- }, |
|
285 |
- updateOnImagesReady: { |
|
286 |
- type: Boolean, |
|
287 |
- default: undefined |
|
288 |
- }, |
|
289 |
- loop: { |
|
290 |
- type: Boolean, |
|
291 |
- default: undefined |
|
292 |
- }, |
|
293 |
- loopAdditionalSlides: { |
|
294 |
- type: Number, |
|
295 |
- default: undefined |
|
296 |
- }, |
|
297 |
- loopedSlides: { |
|
298 |
- type: Number, |
|
299 |
- default: undefined |
|
300 |
- }, |
|
301 |
- loopFillGroupWithBlank: { |
|
302 |
- type: Boolean, |
|
303 |
- default: undefined |
|
304 |
- }, |
|
305 |
- loopPreventsSlide: { |
|
306 |
- type: Boolean, |
|
307 |
- default: undefined |
|
308 |
- }, |
|
309 |
- allowSlidePrev: { |
|
310 |
- type: Boolean, |
|
311 |
- default: undefined |
|
312 |
- }, |
|
313 |
- allowSlideNext: { |
|
314 |
- type: Boolean, |
|
315 |
- default: undefined |
|
316 |
- }, |
|
317 |
- swipeHandler: { |
|
318 |
- type: Boolean, |
|
319 |
- default: undefined |
|
320 |
- }, |
|
321 |
- noSwiping: { |
|
322 |
- type: Boolean, |
|
323 |
- default: undefined |
|
324 |
- }, |
|
325 |
- noSwipingClass: { |
|
326 |
- type: String, |
|
327 |
- default: undefined |
|
328 |
- }, |
|
329 |
- noSwipingSelector: { |
|
330 |
- type: String, |
|
331 |
- default: undefined |
|
332 |
- }, |
|
333 |
- passiveListeners: { |
|
334 |
- type: Boolean, |
|
335 |
- default: undefined |
|
336 |
- }, |
|
337 |
- containerModifierClass: { |
|
338 |
- type: String, |
|
339 |
- default: undefined |
|
340 |
- }, |
|
341 |
- slideClass: { |
|
342 |
- type: String, |
|
343 |
- default: undefined |
|
344 |
- }, |
|
345 |
- slideBlankClass: { |
|
346 |
- type: String, |
|
347 |
- default: undefined |
|
348 |
- }, |
|
349 |
- slideActiveClass: { |
|
350 |
- type: String, |
|
351 |
- default: undefined |
|
352 |
- }, |
|
353 |
- slideDuplicateActiveClass: { |
|
354 |
- type: String, |
|
355 |
- default: undefined |
|
356 |
- }, |
|
357 |
- slideVisibleClass: { |
|
358 |
- type: String, |
|
359 |
- default: undefined |
|
360 |
- }, |
|
361 |
- slideDuplicateClass: { |
|
362 |
- type: String, |
|
363 |
- default: undefined |
|
364 |
- }, |
|
365 |
- slideNextClass: { |
|
366 |
- type: String, |
|
367 |
- default: undefined |
|
368 |
- }, |
|
369 |
- slideDuplicateNextClass: { |
|
370 |
- type: String, |
|
371 |
- default: undefined |
|
372 |
- }, |
|
373 |
- slidePrevClass: { |
|
374 |
- type: String, |
|
375 |
- default: undefined |
|
376 |
- }, |
|
377 |
- slideDuplicatePrevClass: { |
|
378 |
- type: String, |
|
379 |
- default: undefined |
|
380 |
- }, |
|
381 |
- wrapperClass: { |
|
382 |
- type: String, |
|
383 |
- default: undefined |
|
384 |
- }, |
|
385 |
- runCallbacksOnInit: { |
|
386 |
- type: Boolean, |
|
387 |
- default: undefined |
|
388 |
- }, |
|
389 |
- a11y: { |
|
390 |
- type: [Boolean, Object], |
|
391 |
- default: undefined |
|
392 |
- }, |
|
393 |
- autoplay: { |
|
394 |
- type: [Boolean, Object], |
|
395 |
- default: undefined |
|
396 |
- }, |
|
397 |
- controller: { |
|
398 |
- type: Object, |
|
399 |
- default: undefined |
|
400 |
- }, |
|
401 |
- coverflowEffect: { |
|
402 |
- type: Object, |
|
403 |
- default: undefined |
|
404 |
- }, |
|
405 |
- cubeEffect: { |
|
406 |
- type: Object, |
|
407 |
- default: undefined |
|
408 |
- }, |
|
409 |
- fadeEffect: { |
|
410 |
- type: Object, |
|
411 |
- default: undefined |
|
412 |
- }, |
|
413 |
- flipEffect: { |
|
414 |
- type: Object, |
|
415 |
- default: undefined |
|
416 |
- }, |
|
417 |
- hashNavigation: { |
|
418 |
- type: [Boolean, Object], |
|
419 |
- default: undefined |
|
420 |
- }, |
|
421 |
- history: { |
|
422 |
- type: [Boolean, Object], |
|
423 |
- default: undefined |
|
424 |
- }, |
|
425 |
- keyboard: { |
|
426 |
- type: [Boolean, Object], |
|
427 |
- default: undefined |
|
428 |
- }, |
|
429 |
- lazy: { |
|
430 |
- type: [Boolean, Object], |
|
431 |
- default: undefined |
|
432 |
- }, |
|
433 |
- mousewheel: { |
|
434 |
- type: [Boolean, Object], |
|
435 |
- default: undefined |
|
436 |
- }, |
|
437 |
- navigation: { |
|
438 |
- type: [Boolean, Object], |
|
439 |
- default: undefined |
|
440 |
- }, |
|
441 |
- pagination: { |
|
442 |
- type: [Boolean, Object], |
|
443 |
- default: undefined |
|
444 |
- }, |
|
445 |
- parallax: { |
|
446 |
- type: [Boolean, Object], |
|
447 |
- default: undefined |
|
448 |
- }, |
|
449 |
- scrollbar: { |
|
450 |
- type: [Boolean, Object], |
|
451 |
- default: undefined |
|
452 |
- }, |
|
453 |
- thumbs: { |
|
454 |
- type: Object, |
|
455 |
- default: undefined |
|
456 |
- }, |
|
457 |
- virtual: { |
|
458 |
- type: [Boolean, Object], |
|
459 |
- default: undefined |
|
460 |
- }, |
|
461 |
- zoom: { |
|
462 |
- type: [Boolean, Object], |
|
463 |
- default: undefined |
|
464 |
- } |
|
465 |
- }, |
|
466 |
- emits: ['_beforeBreakpoint', '_containerClasses', '_slideClass', '_swiper', 'activeIndexChange', 'afterInit', 'autoplay', 'autoplayStart', 'autoplayStop', 'beforeDestroy', 'beforeInit', 'beforeLoopFix', 'beforeResize', 'beforeSlideChangeStart', 'beforeTransitionStart', 'breakpoint', 'changeDirection', 'click', 'doubleTap', 'doubleClick', 'destroy', 'fromEdge', 'hashChange', 'hashSet', 'imagesReady', 'init', 'keyPress', 'lazyImageLoad', 'lazyImageReady', 'loopFix', 'momentumBounce', 'navigationHide', 'navigationShow', 'observerUpdate', 'orientationchange', 'paginationHide', 'paginationRender', 'paginationShow', 'paginationUpdate', 'progress', 'reachBeginning', 'reachEnd', 'realIndexChange', 'resize', 'scroll', 'scrollbarDragEnd', 'scrollbarDragMove', 'scrollbarDragStart', 'setTransition', 'setTranslate', 'slideChange', 'slideChangeTransitionEnd', 'slideChangeTransitionStart', 'slideNextTransitionEnd', 'slideNextTransitionStart', 'slidePrevTransitionEnd', 'slidePrevTransitionStart', 'slideResetTransitionStart', 'slideResetTransitionEnd', 'sliderMove', 'sliderFirstMove', 'slidesLengthChange', 'slidesGridLengthChange', 'snapGridLengthChange', 'snapIndexChange', 'swiper', 'tap', 'toEdge', 'touchEnd', 'touchMove', 'touchMoveOpposite', 'touchStart', 'transitionEnd', 'transitionStart', 'update', 'zoomChange'], |
|
467 |
- setup: function setup(props, _ref) { |
|
468 |
- var originalSlots = _ref.slots, |
|
469 |
- emit = _ref.emit; |
|
470 |
- var Tag = props.tag, |
|
471 |
- WrapperTag = props.wrapperTag; |
|
472 |
- var containerClasses = ref('swiper-container'); |
|
473 |
- var virtualData = ref(null); |
|
474 |
- var breakpointChanged = ref(false); |
|
475 |
- var initializedRef = ref(false); |
|
476 |
- var swiperElRef = ref(null); |
|
477 |
- var swiperRef = ref(null); |
|
478 |
- var oldPassedParamsRef = ref(null); |
|
479 |
- var slidesRef = { |
|
480 |
- value: [] |
|
481 |
- }; |
|
482 |
- var oldSlidesRef = { |
|
483 |
- value: [] |
|
484 |
- }; |
|
485 |
- var nextElRef = ref(null); |
|
486 |
- var prevElRef = ref(null); |
|
487 |
- var paginationElRef = ref(null); |
|
488 |
- var scrollbarElRef = ref(null); |
|
489 |
- |
|
490 |
- var _getParams = getParams(props), |
|
491 |
- swiperParams = _getParams.params, |
|
492 |
- passedParams = _getParams.passedParams; |
|
493 |
- |
|
494 |
- getChildren(originalSlots, slidesRef, oldSlidesRef); |
|
495 |
- oldPassedParamsRef.value = passedParams; |
|
496 |
- oldSlidesRef.value = slidesRef.value; |
|
497 |
- |
|
498 |
- var onBeforeBreakpoint = function onBeforeBreakpoint() { |
|
499 |
- getChildren(originalSlots, slidesRef, oldSlidesRef); |
|
500 |
- breakpointChanged.value = true; |
|
501 |
- }; |
|
502 |
- |
|
503 |
- swiperParams.onAny = function (event) { |
|
504 |
- for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { |
|
505 |
- args[_key - 1] = arguments[_key]; |
|
506 |
- } |
|
507 |
- |
|
508 |
- emit.apply(void 0, [event].concat(args)); |
|
509 |
- }; |
|
510 |
- |
|
511 |
- Object.assign(swiperParams.on, { |
|
512 |
- _beforeBreakpoint: onBeforeBreakpoint, |
|
513 |
- _containerClasses: function _containerClasses(swiper, classes) { |
|
514 |
- containerClasses.value = classes; |
|
515 |
- }, |
|
516 |
- _swiper: function _swiper(swiper) { |
|
517 |
- swiper.loopCreate = function () {}; |
|
518 |
- |
|
519 |
- swiper.loopDestroy = function () {}; |
|
520 |
- |
|
521 |
- if (swiperParams.loop) { |
|
522 |
- swiper.loopedSlides = calcLoopedSlides(slidesRef.value, swiperParams); |
|
523 |
- } |
|
524 |
- |
|
525 |
- swiperRef.value = swiper; |
|
526 |
- |
|
527 |
- if (swiper.virtual && swiper.params.virtual.enabled) { |
|
528 |
- swiper.virtual.slides = slidesRef.value; |
|
529 |
- swiper.params.virtual.cache = false; |
|
530 |
- |
|
531 |
- swiper.params.virtual.renderExternal = function (data) { |
|
532 |
- virtualData.value = data; |
|
533 |
- }; |
|
534 |
- |
|
535 |
- swiper.params.virtual.renderExternalUpdate = false; |
|
536 |
- } |
|
537 |
- } |
|
538 |
- }); |
|
539 |
- onUpdated(function () { |
|
540 |
- // set initialized flag |
|
541 |
- if (!initializedRef.value && swiperRef.value) { |
|
542 |
- swiperRef.value.emitSlidesClasses(); |
|
543 |
- initializedRef.value = true; |
|
544 |
- } // watch for params change |
|
545 |
- |
|
546 |
- |
|
547 |
- var _getParams2 = getParams(props), |
|
548 |
- newPassedParams = _getParams2.passedParams; |
|
549 |
- |
|
550 |
- var changedParams = getChangedParams(newPassedParams, oldPassedParamsRef.value, slidesRef.value, oldSlidesRef.value); |
|
551 |
- oldPassedParamsRef.value = newPassedParams; |
|
552 |
- |
|
553 |
- if ((changedParams.length || breakpointChanged.value) && swiperRef.value && !swiperRef.value.destroyed) { |
|
554 |
- updateSwiper(swiperRef.value, slidesRef.value, newPassedParams, changedParams); |
|
555 |
- } |
|
556 |
- |
|
557 |
- breakpointChanged.value = false; |
|
558 |
- }); // update on virtual update |
|
559 |
- |
|
560 |
- watch(virtualData, function () { |
|
561 |
- updateOnVirtualData(swiperRef.value); |
|
562 |
- }); // init swiper |
|
563 |
- |
|
564 |
- onMounted(function () { |
|
565 |
- if (!swiperElRef.value) return; |
|
566 |
- initSwiper({ |
|
567 |
- el: swiperElRef.value, |
|
568 |
- nextEl: nextElRef.value, |
|
569 |
- prevEl: prevElRef.value, |
|
570 |
- paginationEl: paginationElRef.value, |
|
571 |
- scrollbarEl: scrollbarElRef.value |
|
572 |
- }, swiperParams); |
|
573 |
- emit('swiper', swiperRef.value); |
|
574 |
- }); |
|
575 |
- onBeforeUnmount(function () { |
|
576 |
- if (swiperRef.value && !swiperRef.value.destroyed) { |
|
577 |
- swiperRef.value.destroy(true, false); |
|
578 |
- } |
|
579 |
- }); // bypass swiper instance to slides |
|
580 |
- |
|
581 |
- function renderSlides(slides) { |
|
582 |
- if (swiperParams.virtual) { |
|
583 |
- return renderVirtual(swiperRef, slides, virtualData.value); |
|
584 |
- } |
|
585 |
- |
|
586 |
- if (!swiperParams.loop || swiperRef.value && swiperRef.value.destroyed) { |
|
587 |
- slides.forEach(function (slide) { |
|
588 |
- if (!slide.props) slide.props = {}; |
|
589 |
- slide.props.swiperRef = swiperRef; |
|
590 |
- }); |
|
591 |
- return slides; |
|
592 |
- } |
|
593 |
- |
|
594 |
- return renderLoop(swiperRef, slides, swiperParams); |
|
595 |
- } |
|
596 |
- |
|
597 |
- return function () { |
|
598 |
- var _getChildren = getChildren(originalSlots, slidesRef, oldSlidesRef), |
|
599 |
- slides = _getChildren.slides, |
|
600 |
- slots = _getChildren.slots; |
|
601 |
- |
|
602 |
- return h(Tag, { |
|
603 |
- ref: swiperElRef, |
|
604 |
- class: uniqueClasses(containerClasses.value) |
|
605 |
- }, [slots['container-start'], needsNavigation(props) && [h('div', { |
|
606 |
- ref: prevElRef, |
|
607 |
- class: 'swiper-button-prev' |
|
608 |
- }), h('div', { |
|
609 |
- ref: nextElRef, |
|
610 |
- class: 'swiper-button-next' |
|
611 |
- })], needsScrollbar(props) && h('div', { |
|
612 |
- ref: scrollbarElRef, |
|
613 |
- class: 'swiper-scrollbar' |
|
614 |
- }), needsPagination(props) && h('div', { |
|
615 |
- ref: paginationElRef, |
|
616 |
- class: 'swiper-pagination' |
|
617 |
- }), h(WrapperTag, { |
|
618 |
- class: 'swiper-wrapper' |
|
619 |
- }, [slots['wrapper-start'], renderSlides(slides), slots['wrapper-end']]), slots['container-end']]); |
|
620 |
- }; |
|
621 |
- } |
|
622 |
-}; |
|
623 |
-export { Swiper }; |
|
624 | 0 |
\ No newline at end of file |
1 | 1 |
new file mode 100644 |
... | ... |
@@ -0,0 +1,623 @@ |
1 |
+import { h, ref, onMounted, onUpdated, onBeforeUnmount, watch } from 'vue'; |
|
2 |
+import { getParams } from './get-params'; |
|
3 |
+import { initSwiper } from './init-swiper'; |
|
4 |
+import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses } from './utils'; |
|
5 |
+import { renderLoop, calcLoopedSlides } from './loop'; |
|
6 |
+import { getChangedParams } from './get-changed-params'; |
|
7 |
+import { getChildren } from './get-children'; |
|
8 |
+import { updateSwiper } from './update-swiper'; |
|
9 |
+import { renderVirtual, updateOnVirtualData } from './virtual'; |
|
10 |
+var Swiper = { |
|
11 |
+ name: 'Swiper', |
|
12 |
+ props: { |
|
13 |
+ tag: { |
|
14 |
+ type: String, |
|
15 |
+ default: 'div' |
|
16 |
+ }, |
|
17 |
+ wrapperTag: { |
|
18 |
+ type: String, |
|
19 |
+ default: 'div' |
|
20 |
+ }, |
|
21 |
+ init: { |
|
22 |
+ type: Boolean, |
|
23 |
+ default: undefined |
|
24 |
+ }, |
|
25 |
+ direction: { |
|
26 |
+ type: String, |
|
27 |
+ default: undefined |
|
28 |
+ }, |
|
29 |
+ touchEventsTarget: { |
|
30 |
+ type: String, |
|
31 |
+ default: undefined |
|
32 |
+ }, |
|
33 |
+ initialSlide: { |
|
34 |
+ type: Number, |
|
35 |
+ default: undefined |
|
36 |
+ }, |
|
37 |
+ speed: { |
|
38 |
+ type: Number, |
|
39 |
+ default: undefined |
|
40 |
+ }, |
|
41 |
+ cssMode: { |
|
42 |
+ type: Boolean, |
|
43 |
+ default: undefined |
|
44 |
+ }, |
|
45 |
+ updateOnWindowResize: { |
|
46 |
+ type: Boolean, |
|
47 |
+ default: undefined |
|
48 |
+ }, |
|
49 |
+ nested: { |
|
50 |
+ type: Boolean, |
|
51 |
+ default: undefined |
|
52 |
+ }, |
|
53 |
+ width: { |
|
54 |
+ type: Number, |
|
55 |
+ default: undefined |
|
56 |
+ }, |
|
57 |
+ height: { |
|
58 |
+ type: Number, |
|
59 |
+ default: undefined |
|
60 |
+ }, |
|
61 |
+ preventInteractionOnTransition: { |
|
62 |
+ type: Boolean, |
|
63 |
+ default: undefined |
|
64 |
+ }, |
|
65 |
+ userAgent: { |
|
66 |
+ type: String, |
|
67 |
+ default: undefined |
|
68 |
+ }, |
|
69 |
+ url: { |
|
70 |
+ type: String, |
|
71 |
+ default: undefined |
|
72 |
+ }, |
|
73 |
+ edgeSwipeDetection: { |
|
74 |
+ type: Boolean, |
|
75 |
+ default: undefined |
|
76 |
+ }, |
|
77 |
+ edgeSwipeThreshold: { |
|
78 |
+ type: Number, |
|
79 |
+ default: undefined |
|
80 |
+ }, |
|
81 |
+ freeMode: { |
|
82 |
+ type: Boolean, |
|
83 |
+ default: undefined |
|
84 |
+ }, |
|
85 |
+ freeModeMomentum: { |
|
86 |
+ type: Boolean, |
|
87 |
+ default: undefined |
|
88 |
+ }, |
|
89 |
+ freeModeMomentumRatio: { |
|
90 |
+ type: Number, |
|
91 |
+ default: undefined |
|
92 |
+ }, |
|
93 |
+ freeModeMomentumBounce: { |
|
94 |
+ type: Boolean, |
|
95 |
+ default: undefined |
|
96 |
+ }, |
|
97 |
+ freeModeMomentumBounceRatio: { |
|
98 |
+ type: Number, |
|
99 |
+ default: undefined |
|
100 |
+ }, |
|
101 |
+ freeModeMomentumVelocityRatio: { |
|
102 |
+ type: Number, |
|
103 |
+ default: undefined |
|
104 |
+ }, |
|
105 |
+ freeModeSticky: { |
|
106 |
+ type: Boolean, |
|
107 |
+ default: undefined |
|
108 |
+ }, |
|
109 |
+ freeModeMinimumVelocity: { |
|
110 |
+ type: Number, |
|
111 |
+ default: undefined |
|
112 |
+ }, |
|
113 |
+ autoHeight: { |
|
114 |
+ type: Boolean, |
|
115 |
+ default: undefined |
|
116 |
+ }, |
|
117 |
+ setWrapperSize: { |
|
118 |
+ type: Boolean, |
|
119 |
+ default: undefined |
|
120 |
+ }, |
|
121 |
+ virtualTranslate: { |
|
122 |
+ type: Boolean, |
|
123 |
+ default: undefined |
|
124 |
+ }, |
|
125 |
+ effect: { |
|
126 |
+ type: String, |
|
127 |
+ default: undefined |
|
128 |
+ }, |
|
129 |
+ breakpoints: { |
|
130 |
+ type: Object, |
|
131 |
+ default: undefined |
|
132 |
+ }, |
|
133 |
+ spaceBetween: { |
|
134 |
+ type: Number, |
|
135 |
+ default: undefined |
|
136 |
+ }, |
|
137 |
+ slidesPerView: { |
|
138 |
+ type: [Number, String], |
|
139 |
+ default: undefined |
|
140 |
+ }, |
|
141 |
+ slidesPerColumn: { |
|
142 |
+ type: Number, |
|
143 |
+ default: undefined |
|
144 |
+ }, |
|
145 |
+ slidesPerColumnFill: { |
|
146 |
+ type: String, |
|
147 |
+ default: undefined |
|
148 |
+ }, |
|
149 |
+ slidesPerGroup: { |
|
150 |
+ type: Number, |
|
151 |
+ default: undefined |
|
152 |
+ }, |
|
153 |
+ slidesPerGroupSkip: { |
|
154 |
+ type: Number, |
|
155 |
+ default: undefined |
|
156 |
+ }, |
|
157 |
+ centeredSlides: { |
|
158 |
+ type: Boolean, |
|
159 |
+ default: undefined |
|
160 |
+ }, |
|
161 |
+ centeredSlidesBounds: { |
|
162 |
+ type: Boolean, |
|
163 |
+ default: undefined |
|
164 |
+ }, |
|
165 |
+ slidesOffsetBefore: { |
|
166 |
+ type: Number, |
|
167 |
+ default: undefined |
|
168 |
+ }, |
|
169 |
+ slidesOffsetAfter: { |
|
170 |
+ type: Number, |
|
171 |
+ default: undefined |
|
172 |
+ }, |
|
173 |
+ normalizeSlideIndex: { |
|
174 |
+ type: Boolean, |
|
175 |
+ default: undefined |
|
176 |
+ }, |
|
177 |
+ centerInsufficientSlides: { |
|
178 |
+ type: Boolean, |
|
179 |
+ default: undefined |
|
180 |
+ }, |
|
181 |
+ watchOverflow: { |
|
182 |
+ type: Boolean, |
|
183 |
+ default: undefined |
|
184 |
+ }, |
|
185 |
+ roundLengths: { |
|
186 |
+ type: Boolean, |
|
187 |
+ default: undefined |
|
188 |
+ }, |
|
189 |
+ touchRatio: { |
|
190 |
+ type: Number, |
|
191 |
+ default: undefined |
|
192 |
+ }, |
|
193 |
+ touchAngle: { |
|
194 |
+ type: Number, |
|
195 |
+ default: undefined |
|
196 |
+ }, |
|
197 |
+ simulateTouch: { |
|
198 |
+ type: Boolean, |
|
199 |
+ default: undefined |
|
200 |
+ }, |
|
201 |
+ shortSwipes: { |
|
202 |
+ type: Boolean, |
|
203 |
+ default: undefined |
|
204 |
+ }, |
|
205 |
+ longSwipes: { |
|
206 |
+ type: Boolean, |
|
207 |
+ default: undefined |
|
208 |
+ }, |
|
209 |
+ longSwipesRatio: { |
|
210 |
+ type: Number, |
|
211 |
+ default: undefined |
|
212 |
+ }, |
|
213 |
+ longSwipesMs: { |
|
214 |
+ type: Number, |
|
215 |
+ default: undefined |
|
216 |
+ }, |
|
217 |
+ followFinger: { |
|
218 |
+ type: Boolean, |
|
219 |
+ default: undefined |
|
220 |
+ }, |
|
221 |
+ allowTouchMove: { |
|
222 |
+ type: Boolean, |
|
223 |
+ default: undefined |
|
224 |
+ }, |
|
225 |
+ threshold: { |
|
226 |
+ type: Number, |
|
227 |
+ default: undefined |
|
228 |
+ }, |
|
229 |
+ touchMoveStopPropagation: { |
|
230 |
+ type: Boolean, |
|
231 |
+ default: undefined |
|
232 |
+ }, |
|
233 |
+ touchStartPreventDefault: { |
|
234 |
+ type: Boolean, |
|
235 |
+ default: undefined |
|
236 |
+ }, |
|
237 |
+ touchStartForcePreventDefault: { |
|
238 |
+ type: Boolean, |
|
239 |
+ default: undefined |
|
240 |
+ }, |
|
241 |
+ touchReleaseOnEdges: { |
|
242 |
+ type: Boolean, |
|
243 |
+ default: undefined |
|
244 |
+ }, |
|
245 |
+ uniqueNavElements: { |
|
246 |
+ type: Boolean, |
|
247 |
+ default: undefined |
|
248 |
+ }, |
|
249 |
+ resistance: { |
|
250 |
+ type: Boolean, |
|
251 |
+ default: undefined |
|
252 |
+ }, |
|
253 |
+ resistanceRatio: { |
|
254 |
+ type: Number, |
|
255 |
+ default: undefined |
|
256 |
+ }, |
|
257 |
+ watchSlidesProgress: { |
|
258 |
+ type: Boolean, |
|
259 |
+ default: undefined |
|
260 |
+ }, |
|
261 |
+ watchSlidesVisibility: { |
|
262 |
+ type: Boolean, |
|
263 |
+ default: undefined |
|
264 |
+ }, |
|
265 |
+ grabCursor: { |
|
266 |
+ type: Boolean, |
|
267 |
+ default: undefined |
|
268 |
+ }, |
|
269 |
+ preventClicks: { |
|
270 |
+ type: Boolean, |
|
271 |
+ default: undefined |
|
272 |
+ }, |
|
273 |
+ preventClicksPropagation: { |
|
274 |
+ type: Boolean, |
|
275 |
+ default: undefined |
|
276 |
+ }, |
|
277 |
+ slideToClickedSlide: { |
|
278 |
+ type: Boolean, |
|
279 |
+ default: undefined |
|
280 |
+ }, |
|
281 |
+ preloadImages: { |
|
282 |
+ type: Boolean, |
|
283 |
+ default: undefined |
|
284 |
+ }, |
|
285 |
+ updateOnImagesReady: { |
|
286 |
+ type: Boolean, |
|
287 |
+ default: undefined |
|
288 |
+ }, |
|
289 |
+ loop: { |
|
290 |
+ type: Boolean, |
|
291 |
+ default: undefined |
|
292 |
+ }, |
|
293 |
+ loopAdditionalSlides: { |
|
294 |
+ type: Number, |
|
295 |
+ default: undefined |
|
296 |
+ }, |
|
297 |
+ loopedSlides: { |
|
298 |
+ type: Number, |
|
299 |
+ default: undefined |
|
300 |
+ }, |
|
301 |
+ loopFillGroupWithBlank: { |
|
302 |
+ type: Boolean, |
|
303 |
+ default: undefined |
|
304 |
+ }, |
|
305 |
+ loopPreventsSlide: { |
|
306 |
+ type: Boolean, |
|
307 |
+ default: undefined |
|
308 |
+ }, |
|
309 |
+ allowSlidePrev: { |
|
310 |
+ type: Boolean, |
|
311 |
+ default: undefined |
|
312 |
+ }, |
|
313 |
+ allowSlideNext: { |
|
314 |
+ type: Boolean, |
|
315 |
+ default: undefined |
|
316 |
+ }, |
|
317 |
+ swipeHandler: { |
|
318 |
+ type: Boolean, |
|
319 |
+ default: undefined |
|
320 |
+ }, |
|
321 |
+ noSwiping: { |
|
322 |
+ type: Boolean, |
|
323 |
+ default: undefined |
|
324 |
+ }, |
|
325 |
+ noSwipingClass: { |
|
326 |
+ type: String, |
|
327 |
+ default: undefined |
|
328 |
+ }, |
|
329 |
+ noSwipingSelector: { |
|
330 |
+ type: String, |
|
331 |
+ default: undefined |
|
332 |
+ }, |
|
333 |
+ passiveListeners: { |
|
334 |
+ type: Boolean, |
|
335 |
+ default: undefined |
|
336 |
+ }, |
|
337 |
+ containerModifierClass: { |
|
338 |
+ type: String, |
|
339 |
+ default: undefined |
|
340 |
+ }, |
|
341 |
+ slideClass: { |
|
342 |
+ type: String, |
|
343 |
+ default: undefined |
|
344 |
+ }, |
|
345 |
+ slideBlankClass: { |
|
346 |
+ type: String, |
|
347 |
+ default: undefined |
|
348 |
+ }, |
|
349 |
+ slideActiveClass: { |
|
350 |
+ type: String, |
|
351 |
+ default: undefined |
|
352 |
+ }, |
|
353 |
+ slideDuplicateActiveClass: { |
|
354 |
+ type: String, |
|
355 |
+ default: undefined |
|
356 |
+ }, |
|
357 |
+ slideVisibleClass: { |
|
358 |
+ type: String, |
|
359 |
+ default: undefined |
|
360 |
+ }, |
|
361 |
+ slideDuplicateClass: { |
|
362 |
+ type: String, |
|
363 |
+ default: undefined |
|
364 |
+ }, |
|
365 |
+ slideNextClass: { |
|
366 |
+ type: String, |
|
367 |
+ default: undefined |
|
368 |
+ }, |
|
369 |
+ slideDuplicateNextClass: { |
|
370 |
+ type: String, |
|
371 |
+ default: undefined |
|
372 |
+ }, |
|
373 |
+ slidePrevClass: { |
|
374 |
+ type: String, |
|
375 |
+ default: undefined |
|
376 |
+ }, |
|
377 |
+ slideDuplicatePrevClass: { |
|
378 |
+ type: String, |
|
379 |
+ default: undefined |
|
380 |
+ }, |
|
381 |
+ wrapperClass: { |
|
382 |
+ type: String, |
|
383 |
+ default: undefined |
|
384 |
+ }, |
|
385 |
+ runCallbacksOnInit: { |
|
386 |
+ type: Boolean, |
|
387 |
+ default: undefined |
|
388 |
+ }, |
|
389 |
+ a11y: { |
|
390 |
+ type: [Boolean, Object], |
|
391 |
+ default: undefined |
|
392 |
+ }, |
|
393 |
+ autoplay: { |
|
394 |
+ type: [Boolean, Object], |
|
395 |
+ default: undefined |
|
396 |
+ }, |
|
397 |
+ controller: { |
|
398 |
+ type: Object, |
|
399 |
+ default: undefined |
|
400 |
+ }, |
|
401 |
+ coverflowEffect: { |
|
402 |
+ type: Object, |
|
403 |
+ default: undefined |
|
404 |
+ }, |
|
405 |
+ cubeEffect: { |
|
406 |
+ type: Object, |
|
407 |
+ default: undefined |
|
408 |
+ }, |
|
409 |
+ fadeEffect: { |
|
410 |
+ type: Object, |
|
411 |
+ default: undefined |
|
412 |
+ }, |
|
413 |
+ flipEffect: { |
|
414 |
+ type: Object, |
|
415 |
+ default: undefined |
|
416 |
+ }, |
|
417 |
+ hashNavigation: { |
|
418 |
+ type: [Boolean, Object], |
|
419 |
+ default: undefined |
|
420 |
+ }, |
|
421 |
+ history: { |
|
422 |
+ type: [Boolean, Object], |
|
423 |
+ default: undefined |
|
424 |
+ }, |
|
425 |
+ keyboard: { |
|
426 |
+ type: [Boolean, Object], |
|
427 |
+ default: undefined |
|
428 |
+ }, |
|
429 |
+ lazy: { |
|
430 |
+ type: [Boolean, Object], |
|
431 |
+ default: undefined |
|
432 |
+ }, |
|
433 |
+ mousewheel: { |
|
434 |
+ type: [Boolean, Object], |
|
435 |
+ default: undefined |
|
436 |
+ }, |
|
437 |
+ navigation: { |
|
438 |
+ type: [Boolean, Object], |
|
439 |
+ default: undefined |
|
440 |
+ }, |
|
441 |
+ pagination: { |
|
442 |
+ type: [Boolean, Object], |
|
443 |
+ default: undefined |
|
444 |
+ }, |
|
445 |
+ parallax: { |
|
446 |
+ type: [Boolean, Object], |
|
447 |
+ default: undefined |
|
448 |
+ }, |
|
449 |
+ scrollbar: { |
|
450 |
+ type: [Boolean, Object], |
|
451 |
+ default: undefined |
|
452 |
+ }, |
|
453 |
+ thumbs: { |
|
454 |
+ type: Object, |
|
455 |
+ default: undefined |
|
456 |
+ }, |
|
457 |
+ virtual: { |
|
458 |
+ type: [Boolean, Object], |
|
459 |
+ default: undefined |
|
460 |
+ }, |
|
461 |
+ zoom: { |
|
462 |
+ type: [Boolean, Object], |
|
463 |
+ default: undefined |
|
464 |
+ } |
|
465 |
+ }, |
|
466 |
+ emits: ['_beforeBreakpoint', '_containerClasses', '_slideClass', '_swiper', 'activeIndexChange', 'afterInit', 'autoplay', 'autoplayStart', 'autoplayStop', 'beforeDestroy', 'beforeInit', 'beforeLoopFix', 'beforeResize', 'beforeSlideChangeStart', 'beforeTransitionStart', 'breakpoint', 'changeDirection', 'click', 'doubleTap', 'doubleClick', 'destroy', 'fromEdge', 'hashChange', 'hashSet', 'imagesReady', 'init', 'keyPress', 'lazyImageLoad', 'lazyImageReady', 'loopFix', 'momentumBounce', 'navigationHide', 'navigationShow', 'observerUpdate', 'orientationchange', 'paginationHide', 'paginationRender', 'paginationShow', 'paginationUpdate', 'progress', 'reachBeginning', 'reachEnd', 'realIndexChange', 'resize', 'scroll', 'scrollbarDragEnd', 'scrollbarDragMove', 'scrollbarDragStart', 'setTransition', 'setTranslate', 'slideChange', 'slideChangeTransitionEnd', 'slideChangeTransitionStart', 'slideNextTransitionEnd', 'slideNextTransitionStart', 'slidePrevTransitionEnd', 'slidePrevTransitionStart', 'slideResetTransitionStart', 'slideResetTransitionEnd', 'sliderMove', 'sliderFirstMove', 'slidesLengthChange', 'slidesGridLengthChange', 'snapGridLengthChange', 'snapIndexChange', 'swiper', 'tap', 'toEdge', 'touchEnd', 'touchMove', 'touchMoveOpposite', 'touchStart', 'transitionEnd', 'transitionStart', 'update', 'zoomChange'], |
|
467 |
+ setup: function setup(props, _ref) { |
|
468 |
+ var originalSlots = _ref.slots, |
|
469 |
+ emit = _ref.emit; |
|
470 |
+ var Tag = props.tag, |
|
471 |
+ WrapperTag = props.wrapperTag; |
|
472 |
+ var containerClasses = ref('swiper-container'); |
|
473 |
+ var virtualData = ref(null); |
|
474 |
+ var breakpointChanged = ref(false); |
|
475 |
+ var initializedRef = ref(false); |
|
476 |
+ var swiperElRef = ref(null); |
|
477 |
+ var swiperRef = ref(null); |
|
478 |
+ var oldPassedParamsRef = ref(null); |
|
479 |
+ var slidesRef = { |
|
480 |
+ value: [] |
|
481 |
+ }; |
|
482 |
+ var oldSlidesRef = { |
|
483 |
+ value: [] |
|
484 |
+ }; |
|
485 |
+ var nextElRef = ref(null); |
|
486 |
+ var prevElRef = ref(null); |
|
487 |
+ var paginationElRef = ref(null); |
|
488 |
+ var scrollbarElRef = ref(null); |
|
489 |
+ |
|
490 |
+ var _getParams = getParams(props), |
|
491 |
+ swiperParams = _getParams.params, |
|
492 |
+ passedParams = _getParams.passedParams; |
|
493 |
+ |
|
494 |
+ getChildren(originalSlots, slidesRef, oldSlidesRef); |
|
495 |
+ oldPassedParamsRef.value = passedParams; |
|
496 |
+ oldSlidesRef.value = slidesRef.value; |
|
497 |
+ |
|
498 |
+ var onBeforeBreakpoint = function onBeforeBreakpoint() { |
|
499 |
+ getChildren(originalSlots, slidesRef, oldSlidesRef); |
|
500 |
+ breakpointChanged.value = true; |
|
501 |
+ }; |
|
502 |
+ |
|
503 |
+ swiperParams.onAny = function (event) { |
|
504 |
+ for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { |
|
505 |
+ args[_key - 1] = arguments[_key]; |
|
506 |
+ } |
|
507 |
+ |
|
508 |
+ emit.apply(void 0, [event].concat(args)); |
|
509 |
+ }; |
|
510 |
+ |
|
511 |
+ Object.assign(swiperParams.on, { |
|
512 |
+ _beforeBreakpoint: onBeforeBreakpoint, |
|
513 |
+ _containerClasses: function _containerClasses(swiper, classes) { |
|
514 |
+ containerClasses.value = classes; |
|
515 |
+ }, |
|
516 |
+ _swiper: function _swiper(swiper) { |
|
517 |
+ swiper.loopCreate = function () {}; |
|
518 |
+ |
|
519 |
+ swiper.loopDestroy = function () {}; |
|
520 |
+ |
|
521 |
+ if (swiperParams.loop) { |
|
522 |
+ swiper.loopedSlides = calcLoopedSlides(slidesRef.value, swiperParams); |
|
523 |
+ } |
|
524 |
+ |
|
525 |
+ swiperRef.value = swiper; |
|
526 |
+ |
|
527 |
+ if (swiper.virtual && swiper.params.virtual.enabled) { |
|
528 |
+ swiper.virtual.slides = slidesRef.value; |
|
529 |
+ swiper.params.virtual.cache = false; |
|
530 |
+ |
|
531 |
+ swiper.params.virtual.renderExternal = function (data) { |
|
532 |
+ virtualData.value = data; |
|
533 |
+ }; |
|
534 |
+ |
|
535 |
+ swiper.params.virtual.renderExternalUpdate = false; |
|
536 |
+ } |
|
537 |
+ } |
|
538 |
+ }); |
|
539 |
+ onUpdated(function () { |
|
540 |
+ // set initialized flag |
|
541 |
+ if (!initializedRef.value && swiperRef.value) { |
|
542 |
+ swiperRef.value.emitSlidesClasses(); |
|
543 |
+ initializedRef.value = true; |
|
544 |
+ } // watch for params change |
|
545 |
+ |
|
546 |
+ |
|
547 |
+ var _getParams2 = getParams(props), |
|
548 |
+ newPassedParams = _getParams2.passedParams; |
|
549 |
+ |
|
550 |
+ var changedParams = getChangedParams(newPassedParams, oldPassedParamsRef.value, slidesRef.value, oldSlidesRef.value); |
|
551 |
+ oldPassedParamsRef.value = newPassedParams; |
|
552 |
+ |
|
553 |
+ if ((changedParams.length || breakpointChanged.value) && swiperRef.value && !swiperRef.value.destroyed) { |
|
554 |
+ updateSwiper(swiperRef.value, slidesRef.value, newPassedParams, changedParams); |
|
555 |
+ } |
|
556 |
+ |
|
557 |
+ breakpointChanged.value = false; |
|
558 |
+ }); // update on virtual update |
|
559 |
+ |
|
560 |
+ watch(virtualData, function () { |
|
561 |
+ updateOnVirtualData(swiperRef.value); |
|
562 |
+ }); // init swiper |
|
563 |
+ |
|
564 |
+ onMounted(function () { |
|
565 |
+ if (!swiperElRef.value) return; |
|
566 |
+ initSwiper({ |
|
567 |
+ el: swiperElRef.value, |
|
568 |
+ nextEl: nextElRef.value, |
|
569 |
+ prevEl: prevElRef.value, |
|
570 |
+ paginationEl: paginationElRef.value, |
|
571 |
+ scrollbarEl: scrollbarElRef.value |
|
572 |
+ }, swiperParams); |
|
573 |
+ emit('swiper', swiperRef.value); |
|
574 |
+ }); |
|
575 |
+ onBeforeUnmount(function () { |
|
576 |
+ if (swiperRef.value && !swiperRef.value.destroyed) { |
|
577 |
+ swiperRef.value.destroy(true, false); |
|
578 |
+ } |
|
579 |
+ }); // bypass swiper instance to slides |
|
580 |
+ |
|
581 |
+ function renderSlides(slides) { |
|
582 |
+ if (swiperParams.virtual) { |
|
583 |
+ return renderVirtual(swiperRef, slides, virtualData.value); |
|
584 |
+ } |
|
585 |
+ |
|
586 |
+ if (!swiperParams.loop || swiperRef.value && swiperRef.value.destroyed) { |
|
587 |
+ slides.forEach(function (slide) { |
|
588 |
+ if (!slide.props) slide.props = {}; |
|
589 |
+ slide.props.swiperRef = swiperRef; |
|
590 |
+ }); |
|
591 |
+ return slides; |
|
592 |
+ } |
|
593 |
+ |
|
594 |
+ return renderLoop(swiperRef, slides, swiperParams); |
|
595 |
+ } |
|
596 |
+ |
|
597 |
+ return function () { |
|
598 |
+ var _getChildren = getChildren(originalSlots, slidesRef, oldSlidesRef), |
|
599 |
+ slides = _getChildren.slides, |
|
600 |
+ slots = _getChildren.slots; |
|
601 |
+ |
|
602 |
+ return h(Tag, { |
|
603 |
+ ref: swiperElRef, |
|
604 |
+ class: uniqueClasses(containerClasses.value) |
|
605 |
+ }, [slots['container-start'], needsNavigation(props) && [h('div', { |
|
606 |
+ ref: prevElRef, |
|
607 |
+ class: 'swiper-button-prev' |
|
608 |
+ }), h('div', { |
|
609 |
+ ref: nextElRef, |
|
610 |
+ class: 'swiper-button-next' |
|
611 |
+ })], needsScrollbar(props) && h('div', { |
|
612 |
+ ref: scrollbarElRef, |
|
613 |
+ class: 'swiper-scrollbar' |
|
614 |
+ }), needsPagination(props) && h('div', { |
|
615 |
+ ref: paginationElRef, |
|
616 |
+ class: 'swiper-pagination' |
|
617 |
+ }), h(WrapperTag, { |
|
618 |
+ class: 'swiper-wrapper' |
|
619 |
+ }, [slots['wrapper-start'], renderSlides(slides), slots['wrapper-end']]), slots['container-end']]); |
|
620 |
+ }; |
|
621 |
+ } |
|
622 |
+}; |
|
623 |
+export { Swiper }; |
|
0 | 624 |
\ No newline at end of file |