8***@qq.com
8***@qq.com
  • 发布:2025-04-03 10:18
  • 更新:2025-04-03 10:18
  • 阅读:1311

【报Bug】swiper swiper-item 卡住一样一闪一闪 只有app安卓打包正式版会

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 10

HBuilderX类型: 正式

HBuilderX版本号: 4.36

手机系统: Android

手机系统版本号: Android 15

手机厂商: 一加

手机机型: ace2

页面类型: vue

vue版本: vue3

打包方式: 云端

项目创建方式: HBuilderX

App下载地址或H5⽹址: https://m.app.mi.com/game?word=%E4%B8%80%E8%AE%AF&token=N6iUXKsMA/BO4SOhsCxuyEi/YQ00wg34KLf+lvlsquZJY/WNvsueZohOGg260WU1qdVh81l6vmSj5TKexqtPB6hDMdohzXQ51LX5j9Js72sM9r91i2upVyl9GRR7rZZqyETgB1R+OOWM+2WeQjqWoRdbosxGI9ml4joTuG7fCtloONBMW6oPDGRkmQv7qIGWkwwsjBc

示例代码:
    <swiper :current="swiperIndex" circular :style="`height:100vh;background:#F5F5F5;` "  
        @change="handleChangeSwiperFn">  
        <swiper-item>  
            <view id="index0">  
                <scroll-view scroll-y="true" class="scroll-Y" :style="`height:calc(100vh - 0px);`">  
                    <paipan :iconList="iconList" ref="paipans0" :ontTypeId="ontTypeId"></paipan>  
                </scroll-view>  
            </view>  
        </swiper-item>  
        <swiper-item>  
            <view id="index1">  
                <scroll-view scroll-y="true" class="scroll-Y" :style="`height:100vh;`">  
                    <paipan :iconList="iconList" ref="paipans1" :ontTypeId="twoTypeId2"></paipan>  
                </scroll-view>  
            </view>  
        </swiper-item>  
        <swiper-item>  
            <view id="index2"> <scroll-view scroll-y="true" class="scroll-Y" :style="`height:100vh;`">  
                    <paipan :iconList="iconList" ref="paipans2" :ontTypeId="ThreeTypeId3"></paipan>  
                </scroll-view>  

            </view>  
        </swiper-item>  
        <swiper-item>  
            <view id="index3"> <scroll-view scroll-y="true" class="scroll-Y" :style="`height:100vh;`">  
                    <paipan :iconList="iconList" ref="paipans3" :ontTypeId="FourTypeId4"></paipan>  
                </scroll-view>  
            </view>  
        </swiper-item>  

    </swiper>     

paipan 里

<template>
<view>
<shop1 v-if="ontTypeId==1"></shop1>
<shop2 v-if="ontTypeId==2"></shop2>
<shop3 v-if="ontTypeId==4"></shop3>
<shop4 v-if="ontTypeId==7"></shop4>
<shop5 v-if="ontTypeId==3"></shop5>
<shop6 v-if="ontTypeId==5"></shop6>

        </view>   
</template>  

<script setup>
import {
onMounted,
ref,
watch,
defineProps
} from 'vue'

   import shop1  from '/pages/index/shop1'  
import shop2  from '/pages/index/shop2'  
import shop3  from '/pages/index/shop3'  
import shop4  from '/pages/index/shop4'  
import shop5  from '/pages/index/shop5'  
import shop6  from '/pages/index/shop6'  

// 定义接收父组件传递过来的 props  
const props = defineProps({  
    ontTypeId: Number, // 父组件传递的消息类型为 String  
})  

</script>

操作步骤:
<swiper :current="swiperIndex" circular :style="`height:100vh;background:#F5F5F5;` "  
        @change="handleChangeSwiperFn">  
        <swiper-item>  
            <view id="index0">  
                <scroll-view scroll-y="true" class="scroll-Y" :style="`height:calc(100vh - 0px);`">  
                    <paipan :iconList="iconList" ref="paipans0" :ontTypeId="ontTypeId"></paipan>  
                </scroll-view>  
            </view>  
        </swiper-item>  

</swiper>
paipan 放多个自定义组件 ontTypeId控制 if 切换ontTypeId时

预期结果:

不卡住

实际结果:

卡住

bug描述:

paipan有 dom if判断0,1,2 给2时 0,1的dom没有销毁 都显示了 卡住一样一闪一闪。 app安卓打包正式版会 换行 paipan 里判断时 出现

2025-04-03 10:18 负责人:无 分享
已邀请:

要回复问题请先登录注册