virtual.js 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. import React from 'react';
  2. function renderVirtual(swiper, slides, virtualData) {
  3. if (!virtualData) return null;
  4. const getSlideIndex = index => {
  5. let slideIndex = index;
  6. if (index < 0) {
  7. slideIndex = slides.length + index;
  8. } else if (slideIndex >= slides.length) {
  9. // eslint-disable-next-line
  10. slideIndex = slideIndex - slides.length;
  11. }
  12. return slideIndex;
  13. };
  14. const style = swiper.isHorizontal() ? {
  15. [swiper.rtlTranslate ? 'right' : 'left']: `${virtualData.offset}px`
  16. } : {
  17. top: `${virtualData.offset}px`
  18. };
  19. const {
  20. from,
  21. to
  22. } = virtualData;
  23. const loopFrom = swiper.params.loop ? -slides.length : 0;
  24. const loopTo = swiper.params.loop ? slides.length * 2 : slides.length;
  25. const slidesToRender = [];
  26. for (let i = loopFrom; i < loopTo; i += 1) {
  27. if (i >= from && i <= to) {
  28. slidesToRender.push(slides[getSlideIndex(i)]);
  29. }
  30. }
  31. return slidesToRender.map((child, index) => {
  32. return /*#__PURE__*/React.cloneElement(child, {
  33. swiper,
  34. style,
  35. key: `slide-${index}`
  36. });
  37. });
  38. }
  39. export { renderVirtual };