virtual.js 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. import { h } from 'vue';
  2. function renderVirtual(swiperRef, 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 = swiperRef.value.isHorizontal() ? {
  15. [swiperRef.value.rtlTranslate ? 'right' : 'left']: `${virtualData.offset}px`
  16. } : {
  17. top: `${virtualData.offset}px`
  18. };
  19. const {
  20. from,
  21. to
  22. } = virtualData;
  23. const loopFrom = swiperRef.value.params.loop ? -slides.length : 0;
  24. const loopTo = swiperRef.value.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(slide => {
  32. if (!slide.props) slide.props = {};
  33. if (!slide.props.style) slide.props.style = {};
  34. slide.props.swiperRef = swiperRef;
  35. slide.props.style = style;
  36. return h(slide.type, {
  37. ...slide.props
  38. }, slide.children);
  39. });
  40. }
  41. export { renderVirtual };