swiper 鼠标滚动开启后第二个幻灯片下面部分看不到了

我vue使用swiper6 总共分成两个幻灯片，开启了鼠标滚动之后，第二个幻灯片就被限制了高度无法滚动看到下面的内容了，该怎么弄？
目前使用了以下这些swiper功能

new Swiper('.swiper2', {
        direction: 'vertical', // Slides的滑动方向-垂直
        effect: 'fade',
        fadeEffect: {
          crossFade: true
        },
        // mousewheel: true,
        autoHeight: true,
        pagination: {
          el: '.swiper-pagination',
          type: 'fraction'
        }
      });

事件冲突了，到第二个的时候是要滚动还是切换呢？这个swiper可没法知道要进行什么操作。要滚动有下面3中方法，有帮助麻烦点个采纳【本回答右上角】，谢谢~~

1）去掉mousewheel:true
2）设置swiper-slide高度，显示所有内容
3）添加slideChangeTransitionEnd事件，判断是需要滚动的swiper-item，调用api禁用swiper自己的滚动事件，但是切换需要点击按钮或者左右滑动来切换

<script language="javascript"> 
var mySwiper = new Swiper('.swiper-container',{
 mousewheel:true,
  on: {
    slideChangeTransitionEnd: function(){
      if(this.activeIndex==1) mySwiper.mousewheel.disable()//注意下标从0开始，禁用
      else mySwiper.mousewheel.enable();//切换到其他没有垂直滚动的item启用
    },
  },
})
</script>

检查一下，是否共用了一个事件，创建两个要用不同的命名参数调用