9***@qq.com
9***@qq.com
  • 发布:2024-08-31 18:21
  • 更新:2024-09-05 16:27
  • 阅读:79

【报Bug】APP(安卓/IOS)scroll-view切换内容重复问题

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

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

HBuilderX类型: 正式

HBuilderX版本号: 4.08

手机系统: 全部

页面类型: vue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

测试过的手机:

VIVO、华为鸿蒙、OPPO

示例代码:
<template>  
    <view class="content">  
        <view>  
            <scroll-view scroll-y style="height: 30vh">  
                {{content}}  
            </scroll-view>  
        </view>  
        <view>  
            <button @click="toggle('up')">上一条</button>  
            <button @click="toggle('down')">下一条</button>  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                title: 'Hello',  
                content: '',  
                currentIndex: 0,  
                conts: [  
                    '111111开启 scroll anchoring 特性,即控制滚动位置不随内容变化而抖动,仅在 iOS 下生效,安卓下可参考 CSS overflow-anchor 属性。',  
                    '222222滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}',  
                    '333333以下示例代码,来自于hello uni-app项目,推荐使用HBuilderX,新建uni-app项目,选择hello uni-app模板,可直接体验完整示例。'  
                ]  
            }  
        },  
        onLoad() {  
        this.content = this.conts[this.currentIndex] || ''  
        },  
        methods: {  
            toggle(type) {  
                let cIndex = this.currentIndex  
                console.log(type, cIndex, 2222)  
                switch (type) {  
                    case 'up':  
                        if (cIndex <= 0) cIndex = 0  
                        else cIndex -= 1  

                        break;  
                    case 'down':  
                        if (cIndex >= this.conts.length - 1) cIndex = this.conts.length - 1  
                        else cIndex += 1  
                        break;  
                }  
                this.currentIndex = cIndex  
                this.content = this.conts[cIndex] || ''  
            }  

        }  
    }  
</script>

操作步骤:

APP不能使用数据线,需要打包后,再打开APP操作

预期结果:

上一条/下一条,展示对应数据

实际结果:

由于scroll-view缓存问题,打包后运行APP,切换上一条/下一条时,内容不清除,拼接下一条内容

bug描述:

使用官网DEMO,可以查看代码

在APP上一条/下一条时,之前内容不清除

2024-08-31 18:21 负责人:无 分享
已邀请:
9***@qq.com

9***@qq.com (作者)

没人修复吗?

要回复问题请先登录注册