在React中引用了swiper.js，如何解决swiper渲染慢，且页面切换后swiper变卡顿的

Question

目前我在用React写移动端页面，有一个页面引用了Swiper@4.2.2版本。页面之间进行路由切换时，Swiper就渲染得特别慢。而且，页面切换几次之后，swiper就变得卡顿。我是这样使用swiper的：new Swiper(".swiper-container", {  pagination: {    el: ".swiper-pagination"  },  initialSlide: swiperIndex,//设定初始化时slide的索引  watchOverflow: true,  observer: true, //修改swiper自己或子元素时，自动初始化swiper  observeParents: true, //修改swiper的父元素时，自动初始化swiper  on: {    slideChangeTransitionStart: function(event) {      matchIndex=this.activeIndex;          }  }});

Answer 1

组件生命周期结束函数里销毁创建的Swiper实例
创建Swpier时用ref属性来指定Swiper容器，不用className