如何更改react-id-swiper中的垂直Swiper方向(从上到下)?

时间:2019-04-24 08:07:13

标签: reactjs swiper

我在我的react项目中设置了两个彼此垂直的垂直滑块。其中一个必须向上移动,而另一个必须向下移动。

我尝试在其中一个滑块的设置中设置reverseDirection: true,但这似乎没有任何效果。我也尝试过rtl: true,希望可以改变方向,但没有改变。两个滑块仍从下向上移动。

以下是到目前为止我的刷卡器的设置(应该向下移动的设置):

const SWIPER_PARAMS = {
  slidesPerView: 3,
  slidesPerGroup: 1,
  loop: true,
  direction: 'vertical',
  autoplay: {
    delay: 1
  },
  speed: 5000,
  disableOnInteraction: false,
  reverseDirection: true,
  spaceBetween: 22,
  rtl: true
};

如果您有任何想法来完成这项工作,请告诉我。

1 个答案:

答案 0 :(得分:0)

这就是我所做的,我只是在滑动器容器周围翻转,然后再次将其自身翻转回去:

  .slider__container {
     transform: rotate(180deg);

     .swiper-slide {
       transform: rotate(180deg);
     }
  }

万一有其他人想知道,没有内置选项,但旋转效果也很好,我现在有一个滑块向上移动而另一个滑块向下移动。