uni-app app端页面配置pullToRefresh会导致ios端swiper卡顿

uni-app app端页面配置pullToRefresh会导致ios端swiper卡顿

开发环境 版本号 项目创建方式
Mac 15.4.1 HBuilderX

产品分类：uniapp/App

PC开发环境操作系统：Mac

HBuilderX类型：正式

HBuilderX版本号：4.65

手机系统：iOS

手机系统版本号：iOS 16

手机厂商：苹果

手机机型：iPhone 13

页面类型：vue

vue版本：vue3

打包方式：云端

项目创建方式：HBuilderX

示例代码：

示例代码：

page.json页面

"app-plus": {  
    "pullToRefresh": {  
        "support": true,  
        "style": "circle",  
        "color": "#AC237C",  
        "offset": "36px"  
    }  
}

index.vue

<template>  
 <swiper class=" h-386rpx w-full"  :indicator-dots="false" previous-margin="48rpx" next-margin="48rpx"  @change="onSwiperChange">
        <swiper-item v-for="(item,index) in cardImages" :key="index" class="flex items-center justify-center" >
          <view>
            <image class=" card-img" :src="item" mode="aspectFit" />
          </view>
        </swiper-item>
      </swiper>
</template>


操作步骤：


### 操作步骤：

在page.json里配置app-plus下的pullToRefresh会导致ios端swiper组件卡顿异常，无法滑动

预期结果：

预期结果：

在page.json里配置app-plus下的pullToRefresh会导致ios端swiper组件卡顿异常，无法滑动


实际结果：


### 实际结果：

在page.json里配置app-plus下的pullToRefresh会导致ios端swiper组件卡顿异常，无法滑动

bug描述：

bug描述：

在page.json里配置app-plus下的pullToRefresh会导致ios端swiper组件卡顿异常，无法滑动


更多关于uni-app app端页面配置pullToRefresh会导致ios端swiper卡顿的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

去掉 “style”: “circle”, 这个吧，iOS用circle 应该是不好弄，还是用default会好点，style 安卓默认是circle， ios默认是default

更多关于uni-app app端页面配置pullToRefresh会导致ios端swiper卡顿的实战教程也可以访问 https://www.itying.com/category-93-b0.html


是的，就是因为ios下拉刷新，导航栏会跟着跑，才这样设置的，没想到导致swiper卡的不能动

这是一个已知的uni-app在iOS平台上的兼容性问题。当页面同时启用pullToRefresh下拉刷新和swiper组件时，确实会出现滑动冲突导致卡顿的情况。

解决方案建议：

  1. 临时方案：可以尝试在swiper组件上添加[@touchstart](/user/touchstart).stop和[@touchmove](/user/touchmove).stop事件阻止冒泡
<swiper [@touchstart](/user/touchstart).stop [@touchmove](/user/touchmove).stop>
  ...
</swiper>
回到顶部