[游戏开发] swiper组件做下滑翻页时遇到超长白屏的问题

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> 游戏开发 -> swiper组件做下滑翻页时遇到超长白屏的问题 -> 正文阅读

[游戏开发]swiper组件做下滑翻页时遇到超长白屏的问题

解决方法如下图：
给swiper组件每一级固定一样的高度就好了

/deep/.swiper-container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: remit(1550) !important;
  .swiper-wrapper {
    width: 100%;
    height: remit(1550) !important;
    .swiper-slide {
      overflow: auto;
      height: remit(1550) !important;
      display: flex;
      justify-content: center;
      }
     }
    }

这个是判断下滑到第几页了，如果需要下滑到最后一页跳转其它路径，可以这样写：
在这里插入图片描述

 slideChange(index) {
            let touchStart
            this.swiper.slides.on('touchstart', function (e) {
                touchStart = e.targetTouches[0].pageY;
            }, true);
            this.swiper.slides.on('touchmove', function (e) {
                this.current = e.targetTouches[0].pageY;
                let touchesDiff = this.current - touchStart;
                if (touchesDiff < -130) {
                    location.href = `https://youxi.vip.qq.com/m/act/60f344f2c8_tencentanime_611453.html?ADTAG=event.611453.kaiqiye`
                }
            }, true)
        },